- /*JavaScript*/
- /*递归遍历*/
- function listNodes(node,level){
- printNodes(node,level);
- var childs=node.childNodes;
- ++level;
- for(var index=0;index<childs.length;++index)
- if(childs[index].hasChildNodes())
- listNodes(childs[index],level);
- else
- printNodes(childs[index],level);
- }
-
-
- /*为了凸显层级关系使用 空格和"|--"组合*/
- function nodeLevels(level){
- var blankStr="";
- for(var i=0;i<level;++i)
- blankStr+=" ";
- blankStr+="|--";
- return blankStr;
- }
-
- var str="";
- function printNodes(node,level){
- str += nodeLevels(level)+node.nodeName+
- "..."+node.nodeType+"..."+node.nodeValue+" "+"<br/>";
-
- /*以下两个测试,可以把str+=换成str=*/
- //alert(str);//alert测试一切正常
- //document.write(str); //加到这发现浏览器没有输出,一行一行write为什么不行?
-
- }
- function getDocumentNodes(){
- listNodes(document,0);
- document.write(str);//正常输出,输出的是最终的字符串
- }
复制代码- <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <title>列出文档中所有节点的层级</title>
- <script type="text/javascript" src="ListNodes.js"></script>
- </head>
- <body>
- <!--测试注释-->
- <script type="text/javascript">
- getDocumentNodes();
- </script>
- </body>
- </html>
复制代码 |