首页 > 解决方案 > 如何为 div 的每个元素添加事件监听器?

问题描述

我正在尝试为这个 div 的每个元素添加一个事件监听器。但我似乎无法访问这个 div 的每个元素。console.log 可以将表格打印为列表。但是在我尝试使用 forEach 方法后它显示错误。为什么会这样?

let table = document.getElementsByClassName('pixel');
console.log(table);

table.forEach(item => {
    console.log(item)
});

标签: javascriptforeach

解决方案


table 的返回值是一个HtmlCollection而不是一个数组,因此您不能使用该Array.prototype.forEach方法。

相反,您可以像这样遍历 div:

let table = document.getElementsByClassName('pixel');
console.log(table);

for (let item of table) {
  console.log(item);
};
<div>
  <div class="pixel">
    P1
  </div>
  <div class="pixel">
    P2
  </div>
</div>


推荐阅读