简单的遍历,熟悉一下dom节点的属性,用的是html Dom ,节点还可以用xml 的dom来解析比如把children 换成childNodes,文本节点便会被统计进来,顺便实现了简单的map功能
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <div class="section"> <input id="search"/> <input id="search"/> <input id="search"/> <input id="search"/> <ul id="datalist"> <li></li> <li></li> <li></li> <li></li> </ul> </div> </body> <script type="text/javascript"> var map = {}; function printTree(node){ // console.log(node.nodeName.toLowerCase(),node.nodeType); var temp_tag = node.nodeName.toLowerCase(); if(map[temp_tag]!=null)map[temp_tag]++; else map[temp_tag]=1; if(node.children!=null){ for (var i = 0; i < node.children.length; i++) { printTree(node.children[i]); } }else {return;}; } window.onload = function(){ printTree(document.body); for (o in map) { console.log(o+':'+map[o]); } } </script> </html>