例如
For each div in body
div.innerHtml = "poo"
next div
这显然是伪代码，但证明什么，我试图做的。
var elements = document.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
elements[i].innerHTML = "foo";
}
如果你想看看只在<body>：
var elements = document.body.getElementsByTagName('div');
for (var i = 0; i < elements.length; i++) {
elements[i].innerHTML = "foo";
}
NodeList.forEach 10
querySelectorAll返回一个静态的非活NodeList露出forEach方法：
const elements = document.querySelectorAll('div');
elements.forEach( el => {
el.innerHTML = "foo";
});
Document.querySelectorAllMDN NodeList.prototype.forEach()MDN
Array.from 9
const elements = document.querySelectorAll('div');
Array.from(elements).forEach( (el) => {
el.innerHTML = "foo";
});
阵列解构9
const elements = document.querySelectorAll('div');
[...elements].forEach( el => {
el.innerHTML = "foo";
});
Destructuring assignmentMDN Document.querySelectorAll()MDN
阵列forEach.call 9
var elements = document.querySelectorAll('div');
[].forEach.call(elements, function( el ) {
el.innerHTML = "foo";
});
For循环
var elements = document.getElementsByTagName('div');
for (var i=0; i<elements.length; i++) {
elements[i].innerHTML = "foo";
}
简单的工作：
NodeList.prototype.forEach = HTMLCollection.prototype.forEach = Array.prototype.forEach;
现在：
// VanillaJS / JavaScript puro
var lista_de_divs = document.querySelectorAll('div')
lista_de_divs.forEach(function (div, i) {
// código...
console.log(i, div)
})
// jQuery
$('div').forEach(function (div, i) {
// código...
console.log(i, div)
})
的替代版本与在ES2015新Array.from()方法和arrow functions：
Array.from(document.body.getElementsByTagName("div")).forEach(a=>a.innerHTML='foo');<div></div>
<div></div>
<div>Test</div>
<div></div>
<div>Hello</div>
<div>World</div>如果大小是你绝对是至关重要的，那么这个解决方案是只有84字节，比113 @ ROKO的回答和120 @ gdoron的。
在这种情况下，jQuery的可以缩短这个更：
$("body div").html('foo');<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div></div>
<div></div>
<div>Test</div>
<div></div>
<div>Hello</div>
<div>World</div>现在只有26字节！
对于ES6
let elements = document.body.getElementsByTagName('div');
Array.prototype.forEach.call(elements, e => {
e.innerHTML = "foo";
});