一 介绍
遍历文档树通过使用parentNode属性、firstChild属性、lastChild属性、previousSibling属性和nextSibling属性来实现。
1、parentNode属性
该属性返回当前节点的父节点。
[pNode=]obj.parentNode
pNode:该参数用来存储父节点,如果不存在父节点将返回“null”。
2、firstChild属性
该属性返回当前节点的第一个子节点。
[cNode=]obj.firstChild
cNode:该参数用来存储第一个子节点,如果不存在将返回“null”。
3、lastChild属性
该属性返回当前节点的最后一个子节点。
[cNode=]obj.lastChild
cNode:该参数用来存储最后一个子节点,如果不存在将返回“null”。
4、previousSibling属性
该属性返回当前节点的前一个兄弟节点。
[sNode=]obj.previousSibling
sNode:该参数用来存储前一个兄弟节点,如果不存在将返回“null”。
5、nextSibling属性
该属性返回当前节点的后一个兄弟节点。
[sNode=]obj.nextSibling
sNode:该参数用来存储后一个兄弟节点,如果不存在将返回“null”。
二 应用
遍历文档树,在页面中,通过相应的按钮可以查找到文档的各个节点的名称、类型和节点值。
三 代码
<head> <title>遍历文档树</title> </head> <body > <h3 id="h1">三号标题</h3> <b>加粗内容</b> <form name="frm" action="#" method="get"> 节点名称:<input type="text" id="na"/><br /> 节点类型:<input type="text" id="ty"/><br /> 节点的值:<input type="text" id="va"/><br /> <input type="button" value="父节点" onclick="txt=nodeS(txt,'parent');"/> <input type="button" value="第一个子节点" onclick="txt=nodeS(txt,'firstChild');"/> <input type="button" value="最后一个子节点" onclick="txt=nodeS(txt,'lastChild');"/><br> <input name="button" type="button" onclick="txt=nodeS(txt,'previousSibling');" value="前一个兄弟节点"/> <input type="button" value="最后一个兄弟节点" onclick="txt=nodeS(txt,'nextSibling');"/> <input type="button" value="返回根节点" onclick="txt=document.documentElement;txtUpdate(txt);"/> </form> <script language="javascript"> <!-- function txtUpdate(txt) { window.document.frm.na.value=txt.nodeName; window.document.frm.ty.value=txt.nodeType; window.document.frm.va.value=txt.nodeValue; } function nodeS(txt,nodeName) { switch(nodeName) { case"previousSibling": if(txt.previousSibling) { txt=txt.previousSibling; } else alert("无兄弟节点"); break; case"nextSibling": if(txt.nextSibling) { txt=txt.nextSibling; } else alert("无兄弟节点"); break; case"parent": if(txt.parentNode) { txt=txt.parentNode; } else alert("无父节点"); break; case"firstChild": if(txt.hasChildNodes()) { txt=txt.firstChild; } else alert("无子节点"); break; case"lastChild": if(txt.hasChildNodes()) { txt=txt.lastChild; } else alert("无子节点") break; } txtUpdate(txt); return txt; } var txt=document.documentElement; txtUpdate(txt); --> </script> </body>
四 运行结果
相关推荐
JS遍历DOM文档树是前端JavaScript开发中的一项基础而重要的技能。DOM(文档对象模型)是JavaScript操作HTML和XML文档的接口,DOM树是一个以树形结构表示文档的模型。每一个HTML或XML文档的节点都对应着DOM树上的一个...
SAX是一种基于事件驱动的解析器,它不构建完整的XML文档树,而是通过事件回调的方式处理XML元素。当解析器遇到文档的开头、元素开始、元素结束等事件时,会调用预先定义的处理器方法。这种方式节省了内存,但操作...
SAX是一种基于事件驱动的解析器,它不创建整个XML文档树,而是逐行读取文件,当遇到元素开始、结束、属性等事件时,调用预先定义好的回调函数。这种方法节省了内存,但需要编写更多的代码来处理事件。SAX适合处理大...
- DOM4j提供两种解析方式:SAXReader用于事件驱动的解析,而DocumentBuilder则用于构建完整的XML文档树。 - 使用`SAXReader.read()`方法可以读取XML文件,并转化为Document对象。 - 解析过程中,可以设置各种解析...
首先,DOM解析允许开发者创建一个完整的XML文档树,然后通过树形结构进行遍历和操作。DOM4J提供了Element、Attribute、Namespace等接口,使得操作XML元素和属性变得直观。例如,你可以通过Element对象的child...
解析过程中,DOM4J会构建出一个完整的XML文档树。 3. **访问和操作元素**:`Element`是DOM4J中的基本节点类型,代表XML文档中的元素。可以使用`Document.getRootElement()`获取根元素,然后通过`Element`的`...
2. 强大的查询功能:yaidom提供了一套强大的查询工具,如选择元素、查找子元素、获取属性值等,可以高效地遍历XML文档树。 3. 解析与序列化:yaidom可以解析XML字符串或文件到其内部表示,同时也能将内部表示的XML...
此外,DIHtmlParser还支持DOM(Document Object Model)操作,可以方便地遍历HTML文档树,进行增删改查等操作。 源码的开放性是DIHtmlParser的一大优势。开发者不仅可以根据需求自定义功能,还可以深入理解控件的...
一旦有了DOM树,我们可以遍历和操作HTML元素。例如,查找特定的节点: ```csharp HtmlNode headline = doc.DocumentNode.SelectSingleNode("//h1"); Console.WriteLine(headline.InnerText); // 输出 "Hello, World...
DOMDocument允许创建、修改和遍历XML文档树,而XMLReader则是一个向前只读的流解析器,它在内存占用方面比DOMDocument更高效。 在实际项目中,选择哪种XML处理方法取决于具体需求,如性能、内存使用和代码简洁性等...
- 解析过程可能涉及递归地遍历XML文档树,构建内部的数据结构以供后续操作。 5. **XML文件的写入** - 对于写入,类可能提供方法来创建新XML文档,或者修改现有文档的节点和属性。 - 序列化时,类将内部数据结构...
2. **DOM解析**:DOM4J也可以使用DOM解析器构建整个XML文档树,适合小规模的XML文档。通过`DocumentBuilder`可以构建XML文档,然后遍历整个文档结构。 ```java DocumentBuilderFactory factory = ...
SAX是一种基于事件驱动的解析器,它不创建整个XML文档树,而是逐行读取文件,当遇到元素开始、结束、属性等事件时触发回调函数。这种方式适用于处理大型XML文件,因为它节省了内存。Java中,可以通过org.xml.sax包来...
2. **文档树(Document Tree)**:所有节点组织成一棵树,根节点是`document`对象,其他节点按照HTML结构嵌套。 3. **访问与遍历(Traversal)**:通过DOM API,我们可以查找特定节点(如`getElementById()`)、...
如果文件结构复杂,可以使用类似的方法遍历整个XML文档树,获取所需的信息。 总的来说,Java操作XML文件的能力强大且灵活,可以根据实际需求选择合适的解析方式。无论是简单的读取配置,还是复杂的XML数据处理,都...
此外,考虑到自动化测试,"龙测试"可能会提供功能,如自动遍历HTML文档树,查找并操作DOM元素,以及进行断言以确认预期结果。 自动化测试通常包括单元测试、集成测试和端到端测试。在HTML环境下,单元测试可能针对...
jQuery是一个流行的JavaScript库,它极大地简化了JavaScript编程,使得操作HTML文档树、添加动画效果、处理用户事件、以及与服务器交互变得更加容易。该库主要通过以下几种方式来简化JavaScript编程: 1. HTML元素...
解析过程中,解析器会遍历 HTML 文档树,根据预设的规则将每个元素和其属性转换为 Slate.js 的 `operations` 或 `value` 对象。 3. 将解析后的 JSON 数据插入到 Slate.js 编辑器中,这样编辑器就能正确显示 HTML ...