javascript - JavaScript- undefined variable

我试图找出这段代码出了什么问题：

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告诉我：
未捕获的ReferenceError：未定义dropDownNav
点击

有人可以给我指路吗？



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

最佳答案

document.getElementsByClassName（）返回与类名称匹配的所有元素的HTMLCollection（类似于数组）。样式属性不是为HTMLCollection定义的，而是为元素定义的。使用以下命令从数组中获取第一个元素

var dropDownNav = document.getElementsByClassName("dropDownNav")[0];