> For the complete documentation index, see [llms.txt](https://lochiwei.gitbook.io/web/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://lochiwei.gitbook.io/web/browser/dom/traversing-dom.md).

# traversing DOM

{% tabs %}
{% tab title="🗺️ 圖解" %} <img src="https://2527454625-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MfvEFZnSBhKT6fJmus0%2Fuploads%2Fk6BgajgR2fG4x1A7Gwqz%2Ffile.drawing.svg?alt=media&amp;token=850658d3-bd27-4ef4-a58c-7dc42880ca18" alt="" class="gitbook-drawing">
{% endtab %}

{% tab title="🔴 主題" %}

* [node.traverse()](/web/browser/dom/type/node/+ext/node.traverse.md)
  {% endtab %}

{% tab title="💈範例" %}
💾 replit: [textContent()](https://replit.com/@pegasusroe/textContent#script.js)

```javascript
// ⭐️ traditional for-loop
for (let i = 0; i < nodeList.length; i++) {
  let node = nodeList[i];
}

// ⭐️ for-of loop
const list = document.querySelectorAll('input[type=checkbox]');

for (let checkbox of list) {
  checkbox.checked = true;
}

// ⭐️ for browsers which don't support NodeList.forEach()
Array.prototype.forEach.call(list, (checkbox) => {
  checkbox.checked = true;
});
```

{% endtab %}

{% tab title="📗 參考" %}

* [x] JavaScript: The Definitive Guide (15.3 Scripting Documents)
* [ ] [Traversing the DOM with JavaScript](https://zellwk.com/blog/dom-traversals/)
  {% endtab %}

{% tab title="👥 相關" %}

* [Element](/web/browser/dom/type/element.md)
* [Node](/web/browser/dom/type/node.md)
* [NodeList](/web/browser/dom/type/nodelist.md)
  {% endtab %}
  {% endtabs %}