javascript - querySelectorAll改变属性

Question

var p = document.getElementById(e),
   nodes = p.querySelectorAll('span');

   for (var i=0; i<nodes.length; i++) {
      node = nodes[i];
      node.innerHTML = '&nbsp;';
   }

如果我在 console.log(p) 和 console.log(nodes) 之后进行操作，我会发现更改影响了节点，但不影响 p。为什么以及如何申请p？

如果我使 nodes = p.childNodes; 一切正常。

那么，主要问题是，为什么它适用于 childNodes 而不适用于 querySelectorAll？

已更新

最后，添加如下内容可以解决问题:

for (var k=0; k<childNodes.length; k++) {
        for (var j=0; j<nodes.length; j++) {    
            if (childNodes[k].id === nodes[j].id) {
                p.replaceChild(nodes[j],childNodes[k]);
            } 
        }   
    }

其中nodes = querySelectorAll和childNodes = p.childNodes;

Answer 1

您可以直接设置p的innerHTML:

p.innerHTML = '&nbsp';

请注意 Element.querySelectorAll() “返回一个非事件 NodeList，其中包含从调用它的元素开始的所有元素后代，这些元素与指定的 CSS 选择器组匹配。”

因此，默认情况下，您在 p 上调用的元素将不会包含在返回的 NodeList 中。