DOM的TreeWalker对象简介

TreeWalker对象是一个功能强大的DOM2对象，可让您轻松地从文档中的节点中过滤并创建自定义集合。 好吧，这听起来很怪异，但是对于需要解析文档树的怪异工作，熟悉这个对象并不会有任何伤害。 在编写脚本时，您可能需要检索具有特定CSS类名的网页中的所有元素，或者需要检索具有特定属性值的元素的XML文档。 TreeWalker对象可以轻松完成这些任务。 在本教程中，我将介绍DOM2的TreeWalker对象，它是 Firefox / Opera8 +中 支持的DOM2方法，  但不是IE6或IE7（截至beta3）。

在继续之前，请注意TreeWalker对象中有一个名为NodeIterator的表兄弟，我将在以后的教程中介绍。

 document.createTreeWalker（）方法

TreeWalker对象可能会变得神秘而且有些复杂，但它实际上只是通过一个方法document.createTreeWalker（）来实现。 该方法及其接受的4个参数简化了可能需要多次传统编码的过程，例如，过滤文档中具有特定元素类型并携带特定属性的所有节点。 但在我们完成所有这些之前，这里是document.createTreeWalker（）的基本描述：

document.createTreeWalker（root，nodesToShow，filter，entityExpandBol）

是时候分解4个参数了：

1. root： 使用开始搜索文档树的根节点。

2. nodesToShow：  TreeWalker应访问的节点类型。

3. filter（或null）： 引用自定义函数（NodeFilter对象）来过滤返回的节点。 输入null表示无。

4. entityExpandBol： 布尔参数，指定是否应扩展实体引用。

对于3），有效常量值为：

NodeFilter常量

NodeFilter.SHOW_ALL	NodeFilter.SHOW_  ENTITY_REFERENCE	NodeFilter.SHOW_  DOCUMENT_TYPE
NodeFilter.SHOW_ELEMENT	NodeFilter.SHOW_ENTITY	NodeFilter.SHOW_FRAGMENT
NodeFilter.SHOW_ATTRIBUTE	NodeFilter.SHOW_  PROCESSING_INSTRUCTION	NodeFilter.SHOW_NOTATION
NodeFilter.SHOW_TEXT	NodeFilter.SHOW_COMMENT
NodeFilter.SHOW_  CDATA_SECTION	NodeFilter.SHOW_DOCUMENT

虽然有15个不同的NodeFilter常量可以限制TreeWalker返回的节点类型，但您可能只会在大多数情况下使用其中的一些节点。 例如，NodeFilter.SHOW_ELEMENT返回所有元素节点。

好吧，所以你很想看到document.createTreeWalker（）的演示，这是一个非常基本的开始：

1 2 3 4 五 6 7 8 9 10 11

<font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" ><div id =“contentarea”></font></font><font></font><font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" > <p>一些<span>文字</ span> </ p></font></font><font></font><font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" > <b>粗体文字</ b></font></font><font></font><font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" > </ DIV></font></font><font></font> <font></font><font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" > <script type =“text / javascript”></font></font><font></font> <font></font><font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" > var rootnode = document.getElementById（“contentarea”）</font></font><font></font><font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" > var walker = document.createTreeWalker（rootnode，NodeFilter.SHOW_ELEMENT， null ， false ）</font></font><font></font> <font></font><font style= "vertical-align: inherit;" ><font style= "vertical-align: inherit;" > </ SCRIPT></font></font>

在此示例中，我指定TreeWalker的根节点开始遍历ID为“contentarea”的容器。 对象的第二个参数指定TreeWalker应该只对容器内的元素节点（与文本节点，注释节点等）进行爬网。 第三个参数设置为null，表示不应该进行额外的过滤（尚未！）。 第4个参数涉及是否应扩展实体引用，并将其设置为false。 有了所有参数，“walker”现在引用DIV中的所有元素（P，SPAN和B）以及DIV本身。

来自 “ ITPUB博客 ” ，链接：http://blog.itpub.net/69933200/viewspace-2652227/，如需转载，请注明出处，否则将追究法律责任。

转载于:http://blog.itpub.net/69933200/viewspace-2652227/