querySelectorAll：操作节点

Question

至于我也明白了，querySelector返回一个真正的可变因素，而querySelectorAll返回非现场静态节点集。

我想调整安装到特定选择的所有元素的风格。它工作正常的第一要素与querySelector，但不是与querySelectorAll所有匹配的元素。我想这是因为节点集是非活的。

是否有解决方法？或者我错过了什么？

Answer 1

的问题是，querySelector返回单个节点。 querySelectorAll返回一组节点（活跃性意味着如果更新它们，组合中的元素将不会被删除）。你需要在每个匹配的元素上设置一个样式，可能会有一个循环 - 你不能只为它们设置一个属性。

所以，你可能需要做这样的事情：

var nodes = document.querySelectorAll('div.foo'); 
for (var i = 0; i < nodes.length; i++) { 
    nodes[i].style.color = 'blue'; 
} 

Answer 2

这也将工作..

[].forEach.call(document.querySelectorAll('div.foo'), function (el) { 
    el.style.color = 'blue'; 
}); 

Answer 3

如querySelectorAll: manipulating nodes但有办法描述，使其工作，因为forEach只适用于阵列，不适用于NodeLists：

Array.prototype.slice.call(document.querySelectorAll('div.foo')).forEach(function(el) { 
    el.style.color = 'blue'; 
});