javascript - remove()是否从 'querySelectorAll'创建的节点列表中删除节点？

Question

我是编程新手，很难理解以下Javascript:

我的代码:

let nodeList = document.getElementById('ID').querySelectorAll('img');
    for (i=0; i < nodeList.length; i++) {
        nodeList[i].remove();
    }

此代码从我的HTML中删除了所有引用的“img”元素，但没有从“nodeList”中删除任何元素。

为什么remove()仅从HTML中删除而不删除'nodeList'-元素，并且有办法从display＆从nodeList中删除元素？

谢谢

Answer 1

这是因为querySelectorAll()返回元素的静态列表。这意味着该列表将保留对元素的引用，甚至将其删除。分配后不会更改。

The Document method querySelectorAll() returns a static (not live) NodeList representing a list of the document's elements that match the specified group of selectors

另一方面，如果您要实时收集，则可以使用 document.getElementsByTagName()， document.getElementsByClassName()等

const divs = document.getElementsByTagName('div');
divs[1].remove();
console.log(divs)

<div>Hey</div>
<div>H</div>
<div>B</div>