---
title: document.createTreeWalker()
slug: Web/API/Document/createTreeWalker
tags:
  - API
  - DOM
  - Reference
  - 方法 遍历 迭代器
translation_of: Web/API/Document/createTreeWalker
---
<div>{{ApiRef("Document")}}</div>

<p><strong><code>document.createTreeWalker()</code></strong> 方法，能创建并返回一个 {{domxref("TreeWalker")}} 对象。</p>

<h2 id="Syntax" name="Syntax">语法</h2>

<pre class="syntaxbox"><em>treeWalker</em> = <em>document</em>.createTreeWalker(<em>root</em>, <em>whatToShow</em>, <em>filter</em>, <em>entityReferenceExpansion</em>);
</pre>

<h3 id="参数">参数</h3>

<dl>
 <dt><code><em>root </em></code></dt>
 <dd>是遍历这个 {{domxref("TreeWalker")}} 的根节点(root {{domxref("Node")}})。通常这是文档的一个元素。</dd>
 <dt><em>whatToShow {{optional_inline}}</em></dt>
 <dd>一个无符号长整型，表示一个整合自 <code><a href="http://www.w3.org/TR/DOM-Level-2-Traversal-Range/traversal.html#Traversal-NodeFilter" title="http://www.w3.org/TR/DOM-Level-2-Traversal-Range/traversal.html#Traversal-NodeFilter">NodeFilter</a></code> 常量属性的位掩码。这是筛选特定类型节点的便捷方式。默认为 0xFFFFFFFF，表示 <code>SHOW_ALL</code> 常量。
 <table class="standard-table">
  <tbody>
   <tr>
    <td class="header">常量</td>
    <td class="header">数值</td>
    <td class="header">描述</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>显示所有节点。</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_ATTRIBUTE</code> {{deprecated_inline}}</td>
    <td><code>2</code></td>
    <td>显示特性{{ domxref("Attr") }}节点。这只在当以一个特性节点{{ domxref("Attr") }}为起点节点的{{ domxref("TreeWalker") }} 中有意义；在这种情况下，这意味着特性节点会出现在迭代或遍历第一次出现的位置。因为特性节点没有其他节点一样的子节点，所以在文档树中的遍历不会出现特性节点。</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_CDATA_SECTION</code> {{deprecated_inline}}</td>
    <td><code>8</code></td>
    <td>显示CDTA {{domxref("CDATASection")}} 节点.</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_COMMENT</code></td>
    <td><code>128</code></td>
    <td>显示注释{{domxref("Comment")}}节点</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_DOCUMENT</code></td>
    <td><code>256</code></td>
    <td>显示文档{{domxref("Document")}}节点</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_DOCUMENT_FRAGMENT</code></td>
    <td><code>1024</code></td>
    <td>显示文档片段{{domxref("DocumentFragment")}}节点</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_DOCUMENT_TYPE</code></td>
    <td><code>512</code></td>
    <td>显示文档类型{{domxref("DocumentType")}}节点</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_ELEMENT</code></td>
    <td><code>1</code></td>
    <td>显示元素{{domxref("Element")}}节点</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_ENTITY</code> {{deprecated_inline}}</td>
    <td><code>32</code></td>
    <td>显示实体{{domxref("Entity")}}节点。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>显示实体引用 {{ domxref("EntityReference") }} 节点。</td>
   </tr>
   <tr>
    <td><code><code><code>NodeFilter.</code></code>SHOW_NOTATION</code> {{deprecated_inline}}</td>
    <td><code>2048</code></td>
    <td>显示符号{{ domxref("Notation") }} 节点。 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>显示处理指令 {{ domxref("ProcessingInstruction") }}节点。</td>
   </tr>
   <tr>
    <td><code><code>NodeFilter.</code>SHOW_TEXT</code></td>
    <td><code>4</code></td>
    <td>顯示文字節點({{ domxref("Text") }} nodes).</td>
   </tr>
  </tbody>
 </table>
 </dd>
 <dt><em>filter <em>{{optional_inline}}</em></em></dt>
 <dd>一个可选的 {{domxref("NodeFilter")}}，即一个具有 <code>acceptNode</code> 方法的对象，此方法被 {{domxref("TreeWalker")}} 调用以决定是否接受已通过 <code>whatToShow</code> 检查的节点。</dd>
 <dt><em>entityReferenceExpansion<em> {{optional_inline}}</em></em> <em>{{obsolete_inline}}</em></dt>
 <dd>一个 {{domxref("Boolean")}} 标识，指示当丢弃一个 {{domxref("EntityReference")}} 时是否同时丢弃其子树。</dd>
</dl>

<h3 id="返回值">返回值</h3>

<p>一个新的 {{domxref("TreeWalker")}} 对象。</p>

<h2 id="Example" name="Example">示例</h2>

<p>以下示例遍历 body 下的所有节点，将节点集合缩小至元素，简单地传递每个可接受的节点（也可在 <code>acceptNode()</code> 方法中缩小集合），然后利用创建的 TreeWalker 迭代器在节点上推进（现在是所有的元素）并把它们推入一个数组。</p>

<pre>var treeWalker = document.createTreeWalker(
  document.body,
  NodeFilter.SHOW_ELEMENT,
  { acceptNode: function(node) { return NodeFilter.FILTER_ACCEPT; } },
  false
);

var nodeList = [];
var currentNode = treeWalker.currentNode;

while(currentNode) {
  nodeList.push(currentNode);
  currentNode = treeWalker.nextNode();
}</pre>

<h2 id="Specification" name="Specification">规范</h2>

<table class="standard-table">
 <tbody>
  <tr>
   <th scope="col">规范</th>
   <th scope="col">状态</th>
   <th scope="col">备注</th>
  </tr>
  <tr>
   <td>{{SpecName('DOM WHATWG', '#dom-document-createtreewalker', 'Document.createTreeWalker')}}</td>
   <td>{{Spec2('DOM WHATWG')}}</td>
   <td>Removed the <code>expandEntityReferences</code> parameter.<br>
    Made the <code>whatToShow</code> and <code>filter</code> parameters optionals.</td>
  </tr>
  <tr>
   <td>{{SpecName('DOM2 Traversal_Range', 'traversal.html#NodeIteratorFactory-createTreeWalker', 'Document.createTreeWalker')}}</td>
   <td>{{Spec2('DOM2 Traversal_Range')}}</td>
   <td>Initial definition.</td>
  </tr>
 </tbody>
</table>

<h2 id="浏览器兼容性">浏览器兼容性</h2>

<p>{{Compat("api.Document.createTreeWalker")}}</p>

<h2 id="参见">参见</h2>

<ul>
 <li>该函数创建的接口对象：{{domxref("TreeWalker")}}。</li>
</ul>