本文阐述了JS遍历DOM文档树的方法。分享给大家参考，如下：

一个介绍

遍历文档树是通过使用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 . previoussible

SNode:此参数用于存储前一个兄弟节点。如果不存在，将返回“null”。

5.下一个兄弟属性

此属性返回当前节点的下一个同级节点。

[sNode=]obj.nextSibling

SNode:此参数用于存储下一个兄弟节点。如果不存在，将返回“null”。

第二次申请

遍历文档树。在页面上，您可以通过相应的按钮找到文档每个节点的名称、类型和节点值。

三个代码

Headtitle遍历文档树/title/head body H3 id=' h1 ' no . 3 title/H3 bold内容表单名称=' frm' action=' #' method=' get '节点名称：输入类型='text' id='na'/br/节点类型：输入类型=' text ' id=' ty '/br/节点值：input Type=' text ' id=' va '/br/input Type=' button ' value=' parent node ' onclick=' txt=nodeS(txt，' parent ')；'/input type=' button ' value=' first child node ' onclick=' txt=nodes(txt，' first child ')；'/input type=' button ' value=' last child node ' onclick=' txt=nodes(txt，' last child ')；'/Brin put name=' button ' type=' button ' onclick=' txt=NOtes(txt，' previousSibling ')；'Value='上一个同级节点'/input type='button' value='上一个同级节点' onclick=' txt=nodes (txt，'下一个同级')；'/input type=' button ' value=' return root node ' onclick=' txt=document . document element；' txtUpdate(txt)；'//formscript语言='javascript '！-函数TxTupdate(txt){ window . document . frm . na . value=TxT . nodename；window . document . frm . ty . value=txt . nodetype；window . document . frm . va . value=txt . node value；}函数nodeS(txt，NodeName){ switch(NodeName){ case ' previousSignal ' : if(txt . previousSignal){ txt=txt . previousSignal；}else alert(“无同级节点”)；打破；case ' next sibling ' : if(txt . next sibling){ txt=txt . next sibling；}else alert(“无同级节点”)；打破；case ' parent ' : if(txt . parent node){ txt=txt . parent node；}else alert(“无父节点”)；打破；case ' first child ' : if(txt . haschildnodes()){ txt=txt . first child；}else alert(“无子节点”)；打破；case ' LastChild ' : if(txt . HasChildNodes()){ txt=txt . LastChild；}else alert(“无子节点”)中断；} txtUpdate(txt)；返回txt} var txt=document . document element；txtUpdate(txt)；-/脚本/正文四个运行结果

更多对JavaScript相关内容感兴趣的读者可以查看本网站专题：《JavaScript操作DOM技巧总结》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》、《JavaScript数学运算用法总结》、0103010

希望本文对JavaScript编程有所帮助。