我正在编写一个简短的脚本来更改<abbr>元素的内部文本,但发现它nodelist没有forEach方法.我知道这nodelist不会继承Array,但似乎不是forEach一个有用的方法吗？是否有一个具体的实施问题,我没有意识到阻止添加forEach到nodelist？
注意:我知道Dojo和jQuery都有forEach某种形式的节点列表.由于限制我无法使用.
我在研究 For/in 和 For/of 循环时遇到术语 Iterable 和 Enumerable。对象应该是可枚举的，我们必须使用 For/in 循环来循环对象的属性，并使用 For/of 来循环数组和字符串。我无法理解这两个术语。这两者有什么区别？
我想使用forEach方法迭代NodeList,我搜索了该方法,我发现解决方法是将NodeList转换为数组:
var nodesArray = Array.prototype.slice.call(nodeList);
nodesArray.forEach(function(node) {
//...
})
但我不明白为什么我们使用这种Array.prototype.slice方法？
我正在寻找一种面向未来的方法来迭代 NodeList （即来自element.querySelectorAll(selector)）以及跨浏览器兼容。之前我一直在使用 ES6 Spread 功能，但是 IE 不支持 spread，所以我使用了 shim。我觉得这有点矫枉过正而且效率低下。然后我遇到了 hack Array.prototype.forEach.call。它有效，但对我来说看起来很臭。
迭代 NodeList 的最佳方法是什么？
我偏向于向后兼容性和干净的代码，但如果您的答案也适用于下面的任何其他标准，我们将不胜感激。
我研究了JavaScript 通过 NodeList 进行迭代，其中介绍了一些方法。不过，不用担心可读性、兼容性等问题，只要能用就行。
我遇到的一些方法是：
const elems = document.querySelectorAll('img');
[].forEach.call(elems, function (o) { console.log(o) });
[...elems].foreach(function (o) { console.log(o) });
for (var i = 0; i < elems.length; i++) {
console.log(elems[i]);
}
for (var i = elems.length - 1; i >= 0; i--) {
console.log(elems[i]);
}
// User-defined
var forEach = function (array, callback, scope) { …我的问题是：我正在尝试通过 Hot 类的 NODELIST 。我想将他们的 className 更改为 'cool' 。当我使用 for 循环时，它的第二个 li 似乎没有改变颜色。有谁知道我在这里犯了什么错误，第二个 li 元素没有改变颜色。
谢谢
var elements = document.getElementsByClassName('hot');
var i;
for(i = 0; i < elements.length; i++) {
elements[i].className = 'cool';
}*{
box-sizing: border-box;
}
.hot {
background-color: red;
border: 1px solid black;
padding: 10px;
margin-top: 1px;
font-size: 25px;
list-style-type: none;
}
.cool {
background-color: blue;
padding: 10px;
color: white;
font-size: 25px;
}<html>
<body>
<div id="page">
<h1 id="header">List</h1>
<h2>Buy Greoceries</h2>
<ul>
<li id="one" class="hot"><em>Fresh</em>figs</li>
<li id="two" …javascript ×5
foreach ×2
nodelist ×2
arrays ×1
css ×1
dom ×1
enumerable ×1
for-in-loop ×1
for-of-loop ×1
html ×1
iterable ×1
slice ×1