如何从两个或多个 DOMNodes 创建 NodeList 对象

Question

例如我有两个DOMNode： let node1 = document.querySelector('#node-1'); let node2 = document.querySelector('#node-2');

如何将它们组合成一个 NodeList 对象？有像 array.push(item) 这样简单的解决方案吗？

Answer 1

您可以将两个节点都添加到文档片段中：

var docFragment = document.createDocumentFragment();
docFragment.appendChild(node1);
docFragment.appendChild(node2);

如果您真的希望它们出现在 NodeList 中，请执行以下操作：

var list = docFragment.querySelectorAll('*');

这样做的缺点是，一旦将节点附加到文档片段，就会将它们从实际文档中删除。

Answer 2

var nList = document.querySelectorAll('[id^="node"]');

收集所有 ID 以 "node" 开头的节点。

var nList = document.querySelectorAll('[id^="node"]');
for (var i = 0; i < nList.length; i++) {
  var node = nList[i].id;
  console.log('Node: ' + node);
}

<div id="node-1">node-1</div>
<div id="node-2">node-2</div>
<div id="notnode-3">notnode-3</div>
<div id="check">Check the console (F12, then choose the 'console' tab)</div>

Answer 3

将此视为对 Orr Siloni 回答的补充：

如果我们不想从 DOM 中删除节点，我们可以使用 node.cloneNode().

添加节点的副本

如何从两个或多个 DOMNodes 创建 NodeList 对象

How to create NodeList object from two or more DOMNodes

javascript

dom

dom-node