0

我试图弄清楚这段代码有什么问题：

function toggle_visibility() {
    var dropDownNav = document.getElementsByClassName("dropDownNav");
    if (dropDownNav.style.display == 'block') e.style.display = 'none';
    else dropDownNav.style.display = 'block';
}

HTML 是这样的：

 <a class="dropDownNavButton" href="#" onclick=
"toggle_visibility(dropDownNav)"><img alt="menu icon" src=
"img/navIcon.png"></a>

<ul class="dropDownNav">
    <li class="liWorks">
        <a href="works.html">Works</a>
    </li>

    <li class="liAbout">
        <a href="#">About</a>
    </li>

    <li class="liContact">
        <a href="contact.html">Contact</a>
    </li>

    <li class="liBlog">
        <a href="#">Blog</a>
    </li>
</ul>

然而 Chrome 告诉我： Uncaught ReferenceError: dropDownNav is not defined onclick

有人可以给我指路吗？

非常感谢所有的快速回答！第一次使用stackoverflow，绝对不是最后一次。它终于奏效了，我为数组添加了 index[0]，并在 onClick 函数上删除了 dropDownNav。唯一的问题是，当我第二次单击时，我希望 dropDownNav 显示恢复为无。有什么线索吗？

4

1 回答 1

5

document.getElementsByClassName() 返回与类名匹配的所有元素的 HTMLCollection（类似于数组）。style 属性不是为HTMLCollection定义的，而是为Element定义的。使用从数组中获取第一个元素

var dropDownNav = document.getElementsByClassName("dropDownNav")[0];
于 2013-05-06T11:05:09.287 回答