parent.document.getElementsByClassName(...).addEventListener is not a function

152 阅读1分钟

报错 parent.document.getElementsByClassName(...).addEventListener is not a function 的原因是 getElementsByClassName 返回的是一个 HTMLCollection(类似数组),而不是单个元素,HTMLCollection 并没有 addEventListener 方法

如果您想给获取到的多个元素添加事件监听器,您需要遍历这个 HTMLCollection,并为每个元素分别添加事件监听器。以下是修改后的示例代码:

// 获取类名为 fruit-item 的元素数组 
let fruitItems = parent.document.getElementsByClassName('fruit-item'); 
// 遍历元素数组,给每个元素添加事件监听器 
for (let i = 0; i < fruitItems.length; i++) { 
fruitItems[i].addEventListener('click', function() {
console.log('点击了 ' + fruitItems[i].textContent); }); 
}

getElementById 方法通过指定元素的 ID 属性来获取单个元素。由于 ID 在整个文档中应该是唯一的,所以它只会返回一个匹配的元素。