我想遍历一些DOM元素,我正在这样做:
document.getElementsByClassName( "myclass" ).forEach( function(element, index, array) { //do stuff });
但我得到一个错误:
document.getElementsByClassName(“ myclass”)。forEach不是函数
我使用的是Firefox 3,所以我知道这两个getElementsByClassName和Array.forEach都存在。这工作正常:
getElementsByClassName
Array.forEach
[2, 5, 9].forEach( function(element, index, array) { //do stuff });
是getElementsByClassName数组的结果吗?如果没有,那是什么?
不需要。如DOM4中所指定,它是一个HTMLCollection(至少在现代浏览器中。较旧的浏览器返回NodeList)。
HTMLCollection
NodeList
在所有现代浏览器(几乎所有其他IE<=8)中,您都可以调用Array的forEach方法,并将其元素列表(为HTMLCollectionorNodeList)作为this值传递给它:
forEach
this
var els = document.getElementsByClassName("myclass"); Array.prototype.forEach.call(els, function(el) { // Do stuff here console.log(el.tagName); }); // Or [].forEach.call(els, function (el) {...});
如果您可以使用ES6感到满意(例如,您可以放心地忽略InternetExplorer或使用ES5编译器),则可以使用Array.from:
Array.from
Array.from(els).forEach((el) => { // Do stuff here console.log(el.tagName); });