为什么addEventListener不能和getElementByClassName一起工作？[重复]

Question

这个问题在这里已经有了答案:

querySelectorAll和getElementsBy*方法返回什么？ (10个回答)

封闭 2个月前.

我有这样的问题，我不懂js，所以我不明白getElementByClassName是如何工作的，当我只用id时，它的工作是完美的，但现在用getElementByClassName不工作。

How can I make it work?



<ul>
  <li>Item 2</li>
  <li id="item">
    Item 2
    <ul class="sub-menu">
      <li>Sub Item<li/>
    </ul>
  </li>
  <li>Item 2</li>
</ul>


(function (d) {
    let item = d.getElementById('item');
    let subMenu = d.getElementsByClassName('sub-menu');
    if(item!=null){
        item.addEventListener('click', () => subMenu.classList.toggle('opened'));
    }
})(document);

Answer 1

getElementsByClassName返回一个数组，你可能想要第一个元素。

(function(d) {
      let item = d.getElementById('item');
      let subMenu = d.getElementsByClassName('sub-menu');
      if (item != null) {
        item.addEventListener('click', () => subMenu[0].classList.toggle('opened'));
      }
    })(document)