迭代節點
該 NodeIterator 介面提供了一個 DOM 樹遍歷節點的方法。
鑑於這樣的檔案:
<html>
<body>
<section class="main">
<ul>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
</ul>
</section>
</body>
</html>
可以想象一個迭代器來獲取 <li>
元素:
let root = document.body;
let whatToShow = NodeFilter.SHOW_ELEMENT | NodeFilter.SHOW_TEXT;
let filter = (node) => node.nodeName.toLowerCase() === 'li' ?
NodeFilter.FILTER_ACCEPT :
NodeFilter.FILTER_REJECT;
let iterator = document.createNodeIterator(root, whatToShow, filter);
var node;
while (node = iterator.nextNode()) {
console.log(node);
}
示例改編自 Mozilla 貢獻者從 Mozilla 開發者網路上的 document.createNodeIterator()
文件提供的示例,該文件在 CC-by-SA 2.5下獲得許可。
這將記錄如下:
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
<li>List Item</li>
請注意,這與 TreeWalker iterface 類似,但僅提供 nextNode()
和 previousNode()
功能。