TreeWalker

  • Revision slug: Web/API/TreeWalker
  • Revision title: TreeWalker
  • Revision id: 461825
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment

Revision Content

{{DomRef}}

The TreeWalker object represents the nodes of a document subtree and a position within them.

A TreeWalker can be created using the {{domxref("Document.createTreeWalker()")}} method.

Properties

This interface doesn't inherit any property.

{{domxref("TreeWalker.root")}} {{readonlyInline}}
Returns a {{domxref("Node")}} representing the root node as specified when the TreeWalker was created.
{{domxref("TreeWalker.whatToShow")}} {{readonlyInline}}
Returns an unsigned long being a bitmask made of constants describing the types of {{domxref("Node")}} that must to be presented. Non-matching nodes are skipped, but their children may be included, if relevant. The possible values are:
Constant Numerical value Description
NodeFilter.SHOW_ALL -1 (that is the max value of unsigned long) Shows all nodes.
NodeFilter.SHOW_ATTRIBUTE {{deprecated_inline}} 2 Shows attribute {{ domxref("Attr") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Attr") }} node as its root; in this case, it means that the attribute node will appear in the first position of the iteration or traversal. Since attributes are never children of other nodes, they do not appear when traversing over the document tree.
NodeFilter.SHOW_CDATA_SECTION {{deprecated_inline}} 8 Shows {{ domxref("CDATASection") }} nodes.
NodeFilter.SHOW_COMMENT 128 Shows {{ domxref("Comment") }} nodes.
NodeFilter.SHOW_DOCUMENT 256 Shows {{ domxref("Document") }} nodes.
NodeFilter.SHOW_DOCUMENT_FRAGMENT 1024 Shows {{ domxref("DocumentFragment") }} nodes.
NodeFilter.SHOW_DOCUMENT_TYPE 512 Shows {{ domxref("DocumentType") }} nodes.
NodeFilter.SHOW_ELEMENT 1 Shows {{ domxref("Element") }} nodes.
NodeFilter.SHOW_ENTITY {{deprecated_inline}} 32 Shows {{ domxref("Entity") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Entity") }} node as its root; in this case, it means that the {{ domxref("Entity") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.
NodeFilter.SHOW_ENTITY_REFERENCE {{deprecated_inline}} 16 Shows {{ domxref("EntityReference") }} nodes.
NodeFilter.SHOW_NOTATION {{deprecated_inline}} 2048 Shows {{ domxref("Notation") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with a {{ domxref("Notation") }} node as its root; in this case, it means that the {{ domxref("Notation") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.
NodeFilter.SHOW_PROCESSING_INSTRUCTION 64 Shows {{ domxref("ProcessingInstruction") }} nodes.
NodeFilter.SHOW_TEXT 4 Shows {{ domxref("Text") }} nodes.
{{domxref("TreeWalker.filter")}} {{readonlyInline}}
Returns a {{domxref("NodeFilter")}} used to select the relevant nodes.
{{domxref("TreeWalker.expandEntityReferences")}} {{readonlyInline}}{{deprecated_inline}}
Is a {{domxref("Boolean")}} indicating if, when discarding an {{domxref("EntityReference")}} its whole sub-tree must be discarded at the same time.
{{domxref("TreeWalker.currentNode")}}
Is the {{domxref("Node")}} on which the TreeWalker is currently pointing at.

Methods

This interface doesn't inherit any method.

{{domxref("TreeWalker.parentNode()")}}
Moves the current {{domxref("Node")}} to the first visible ancestor node in the document order, and returns the found node. It also moves the current node to this one. If no such node exists, or if it is before that the root node defined at the object construction, returns null and the current node is not changed.
{{domxref("TreeWalker.firstChild()")}}
Moves the current {{domxref("Node")}} to the first visible child of the current node, and returns the found child. It also moves the current node to this child. If no such child exists, returns null and the current node is not changed.
{{domxref("TreeWalker.lastChild()")}}
Moves the current {{domxref("Node")}} to the last visible child of the current node, and returns the found child. It also moves the current node to this child. If no such child exists, returns null and the current node is not changed.
{{domxref("TreeWalker.previousSibling()")}}
Moves the current {{domxref("Node")}} to its previous sibling, if any, and returns the found sibling. I there is no such node, return null and the current node is not changed.
{{domxref("TreeWalker.nextSibling()")}}
Moves the current {{domxref("Node")}} to its next sibling, if any, and returns the found sibling. I there is no such node, return null and the current node is not changed.
{{domxref("TreeWalker.previousNode()")}}
Moves the current {{domxref("Node")}} to the previous visible node in the document order, and returns the found node. It also moves the current node to this one. If no such node exists,or if it is before that the root node defined at the object construction, returns null and the current node is not changed.
{{domxref("TreeWalker.nextNode()")}}
Moves the current {{domxref("Node")}} to the next visible node in the document order, and returns the found node. It also moves the current node to this one. If no such node exists, returns null and the current node is not changed.

Specifications

Specification Status Comment
{{SpecName('DOM WHATWG', '#treeWalker', 'TreeWalker')}} {{Spec2('DOM WHATWG')}} Removed the expandEntityReferences property.
{{SpecName('DOM2 Traversal_Range', 'traversal.html#Traversal-TreeWalker', 'TreeWalker')}} {{Spec2('DOM2 Traversal_Range')}} Initial definition.

Browser compatibility

{{CompatibilityTable}}

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
Basic support 1.0 {{CompatGeckoDesktop("1.8.1")}} 9.0 9.0 3.0
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support {{CompatVersionUnknown}} {{CompatGeckoMobile("1.8.1")}} {{CompatVersionUnknown}} 9.0 3.0

See also

  • The creator method: {{domxref("Document.createTreeWalker()")}}.
  • Related interfaces: {{domxref("NodeFilter")}}, {{domxref("NodeIterator")}}.

Revision Source

<div>
  {{DomRef}}</div>
<p>The <strong><code>TreeWalker</code></strong> object represents the nodes of a document subtree and a position within them.</p>
<p>A <code>TreeWalker</code> can be created using the {{domxref("Document.createTreeWalker()")}} method.</p>
<h2 id="Properties" name="Properties">Properties</h2>
<p><em>This interface doesn't inherit any property.</em></p>
<dl>
  <dt>
    {{domxref("TreeWalker.root")}} {{readonlyInline}}</dt>
  <dd>
    Returns a {{domxref("Node")}} representing the root node as specified when the <code>TreeWalker</code> was created.</dd>
  <dt>
    {{domxref("TreeWalker.whatToShow")}} {{readonlyInline}}</dt>
  <dd>
    Returns an <code>unsigned long</code> being a bitmask made of constants describing the types of {{domxref("Node")}} that must to be presented. Non-matching nodes are skipped, but their children may be included, if relevant. The possible values are:<br />
    <table class="standard-table">
      <tbody>
        <tr>
          <td class="header">Constant</td>
          <td class="header">Numerical value</td>
          <td class="header">Description</td>
        </tr>
        <tr>
          <td><code>NodeFilter.SHOW_ALL</code></td>
          <td><code>-1</code> (that is the max value of <code>unsigned long</code>)</td>
          <td>Shows all nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_ATTRIBUTE</code> {{deprecated_inline}}</td>
          <td><code>2</code></td>
          <td>Shows attribute {{ domxref("Attr") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Attr") }} node as its root; in this case, it means that the attribute node will appear in the first position of the iteration or traversal. Since attributes are never children of other nodes, they do not appear when traversing over the document tree.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_CDATA_SECTION</code> {{deprecated_inline}}</td>
          <td><code>8</code></td>
          <td>Shows {{ domxref("CDATASection") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_COMMENT</code></td>
          <td><code>128</code></td>
          <td>Shows {{ domxref("Comment") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_DOCUMENT</code></td>
          <td><code>256</code></td>
          <td>Shows {{ domxref("Document") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_DOCUMENT_FRAGMENT</code></td>
          <td><code>1024</code></td>
          <td>Shows {{ domxref("DocumentFragment") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_DOCUMENT_TYPE</code></td>
          <td><code>512</code></td>
          <td>Shows {{ domxref("DocumentType") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_ELEMENT</code></td>
          <td><code>1</code></td>
          <td>Shows {{ domxref("Element") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_ENTITY</code> {{deprecated_inline}}</td>
          <td><code>32</code></td>
          <td>Shows {{ domxref("Entity") }}&nbsp;nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with an {{ domxref("Entity") }} node as its root; in this case, it means that the {{ domxref("Entity") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_ENTITY_REFERENCE</code> {{deprecated_inline}}</td>
          <td><code>16</code></td>
          <td>Shows {{ domxref("EntityReference") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code><code>NodeFilter.</code></code>SHOW_NOTATION</code> {{deprecated_inline}}</td>
          <td><code>2048</code></td>
          <td>Shows {{ domxref("Notation") }} nodes. This is meaningful only when creating a {{ domxref("TreeWalker") }} with a {{ domxref("Notation") }} node as its root; in this case, it means that the {{ domxref("Notation") }} node will appear in the first position of the traversal. Since entities are not part of the document tree, they do not appear when traversing over the document tree.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_PROCESSING_INSTRUCTION</code></td>
          <td><code>64</code></td>
          <td>Shows {{ domxref("ProcessingInstruction") }}&nbsp;nodes.</td>
        </tr>
        <tr>
          <td><code><code>NodeFilter.</code>SHOW_TEXT</code></td>
          <td><code>4</code></td>
          <td>Shows {{ domxref("Text") }}&nbsp;nodes.</td>
        </tr>
      </tbody>
    </table>
  </dd>
  <dt>
    {{domxref("TreeWalker.filter")}} {{readonlyInline}}</dt>
  <dd>
    Returns a {{domxref("NodeFilter")}} used to select the relevant nodes.</dd>
  <dt>
    {{domxref("TreeWalker.expandEntityReferences")}} {{readonlyInline}}{{deprecated_inline}}</dt>
  <dd>
    Is a {{domxref("Boolean")}} indicating if, when discarding an {{domxref("EntityReference")}} its whole sub-tree must be discarded at the same time.</dd>
  <dt>
    {{domxref("TreeWalker.currentNode")}}</dt>
  <dd>
    Is the {{domxref("Node")}} on which the <code>TreeWalker</code> is currently pointing at.</dd>
</dl>
<h2 id="Methods" name="Methods">Methods</h2>
<p><em>This interface doesn't inherit any method.</em></p>
<dl>
  <dt>
    {{domxref("TreeWalker.parentNode()")}}</dt>
  <dd>
    Moves the current {{domxref("Node")}} to the first <em>visible</em> ancestor node in the document order, and returns the found node. It also moves the current node to this one. If no such node exists, or if it is before that the <em>root</em><em> node</em> defined at the object construction, returns <code>null</code> and the current node is not changed.</dd>
  <dt>
    {{domxref("TreeWalker.firstChild()")}}</dt>
  <dd>
    Moves the current {{domxref("Node")}} to the first <em>visible</em> child of the current node, and returns the found child. It also moves the current node to this child. If no such child exists, returns <code>null</code> and the current node is not changed.</dd>
  <dt>
    {{domxref("TreeWalker.lastChild()")}}</dt>
  <dd>
    Moves the current {{domxref("Node")}} to the last <em>visible</em> child of the current node, and returns the found child. It also moves the current node to this child. If no such child exists, returns <code>null</code> and the current node is not changed.</dd>
  <dt>
    {{domxref("TreeWalker.previousSibling()")}}</dt>
  <dd>
    Moves the current {{domxref("Node")}} to its previous sibling, if any, and returns the found sibling. I there is no such node, return <code>null</code> and the current node is not changed.</dd>
  <dt>
    {{domxref("TreeWalker.nextSibling()")}}</dt>
  <dd>
    Moves the current {{domxref("Node")}} to its next sibling, if any, and returns the found sibling. I there is no such node, return <code>null</code> and the current node is not changed.</dd>
  <dt>
    {{domxref("TreeWalker.previousNode()")}}</dt>
  <dd>
    Moves the current {{domxref("Node")}} to the previous <em>visible</em> node in the document order, and returns the found node. It also moves the current node to this one. If no such node exists,or if it is before that the <em>root</em><em> node</em> defined at the object construction, returns <code>null</code> and the current node is not changed.</dd>
  <dt>
    {{domxref("TreeWalker.nextNode()")}}</dt>
  <dd>
    Moves the current {{domxref("Node")}} to the next <em>visible</em> node in the document order, and returns the found node. It also moves the current node to this one. If no such node exists, returns <code>null</code> and the current node is not changed.</dd>
</dl>
<h2 id="Specification" name="Specification">Specifications</h2>
<table class="standard-table">
  <tbody>
    <tr>
      <th scope="col">Specification</th>
      <th scope="col">Status</th>
      <th scope="col">Comment</th>
    </tr>
    <tr>
      <td>{{SpecName('DOM WHATWG', '#treeWalker', 'TreeWalker')}}</td>
      <td>{{Spec2('DOM WHATWG')}}</td>
      <td>Removed the <code>expandEntityReferences</code> property.</td>
    </tr>
    <tr>
      <td>{{SpecName('DOM2 Traversal_Range', 'traversal.html#Traversal-TreeWalker', 'TreeWalker')}}</td>
      <td>{{Spec2('DOM2 Traversal_Range')}}</td>
      <td>Initial definition.</td>
    </tr>
  </tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>1.0</td>
        <td>{{CompatGeckoDesktop("1.8.1")}}</td>
        <td>9.0</td>
        <td>9.0</td>
        <td>3.0</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Mobile</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>{{CompatGeckoMobile("1.8.1")}}</td>
        <td>{{CompatVersionUnknown}}</td>
        <td>9.0</td>
        <td>3.0</td>
      </tr>
    </tbody>
  </table>
</div>
<h2 id="See_also">See also</h2>
<ul>
  <li>The creator method: {{domxref("Document.createTreeWalker()")}}.</li>
  <li>Related interfaces: {{domxref("NodeFilter")}}, {{domxref("NodeIterator")}}.</li>
</ul>
Revert to this revision