【Dom】通过递归获取节点的层次关系

<script>
	//通过递归获取节点的层次关系
	var str = " ";
	function listNodes(node,level){
		printInfo(node,level);
		level++;
		var nodes = node.childNodes; 
		for(var x=0;x<nodes.length;x++){		
			if(nodes[x].hasChildNodes()) 
				listNodes(nodes[x],level);
			else 
				printInfo(nodes[x],level);
		} 
	}
	
	function getSpace(level){  //建立层级关系
		
		var s = "  ";
		for(var x=0;x<level;x++){
			s +="|-------";
		}
		return s ;
	}
	
	function printInfo(node,level){   //打印信息
		str += getSpace(level) + "name:" + node.nodeName +".... type:" +node.nodeType + ".....value:"+node.nodeValue+"<br/>";
	}
	
	function getNodes(){  //递归调用
		listNodes(document,0);
		document.write(str);	
	}
</script>

按钮触发事件

            <input type="button" value="Demo" onClick="getNodes()" />