forEach 适用于 querySelectorAll，但不适用于 getElementsByTagName？ [复制]答案

【问题标题】：forEach works on querySelectorAll, but not getElementsByTagName? [duplicate]forEach 适用于 querySelectorAll，但不适用于 getElementsByTagName？ [复制]
【发布时间】：2016-10-24 07:33:35
【问题描述】：

在编写代码时，我遇到了一些很奇怪的东西。

以下代码可以正常工作：

document.querySelectorAll("button").forEach(function(e) {
    e.addEventListener("click", function() {
        console.log(e);
    });
});

但是，以下不是：

document.getElementsByTagName("button").forEach(function(e) {
    e.addEventListener("click", function() {
        console.log(e);
    });
})

我在这里很困惑。据我所知，document.getElementsByTagName("button") 返回与document.querySelectorAll("button") 完全相同的数组。我错了吗？这里有什么问题？和forEach有关系吗？

旁注：

我遇到了this post，但它没有回答我的问题。

只是强调：我没有使用 jQuery。

附： - 我已经知道forEach 与常规for 循环之间的区别和优缺点，所以除非forEach 是这两个函数工作方式不同的具体原因，forEach 与@987654333 @辩论与我的问题无关。

【问题讨论】：

i.stack.imgur.com/nbilo.png
getElementsByTagName 返回一个 HTMLCollection - querySelectorAll 返回一个 NodeList - NodeList （在某些浏览器中）有一个 forEach 方法 - compatibility table
如果你想使用 document.getElementsByTagName("button") 你可以这样做 Array.from(document.getElementsByTagName("button")).forEach();

标签： javascript for-loop foreach getelementsbytagname selectors-api

【解决方案1】：

不同之处在于从这些方法返回的内容。 querySelectorAll 返回 NodeList，而 getElementsByTagName 返回 HTMLCollection。它们都不支持通用的 Array.forEach，但 NodeList 实现了自己的 NodeList.forEach，这就是您在这里所要实现的。

【讨论】：