遍历Dom树

Posted 2020-10-01 哈哈敲敲

遍历Dom树，可以返回当前页面有那些元素及其数量

 

(function(){

    //遍历Dom树
    var doms={
        length:0
    }
    function eachDomTree(root){
        var childNodes=root.childNodes,
            len=childNodes.length;
        for(var i=0;i<len;i++){
            var item=childNodes[i];
            if(item.nodeType===1){
                var tagName=item.nodeName.toLowerCase();
                if(tagName in doms){
                    doms[tagName]++
                }else{
                    doms[tagName]=1;
                    doms[‘length‘]++
                }
            }
            if(item.childNodes.length>0){
                eachDomTree(item)
            }
        }
    }
    eachDomTree(document.body)
    console.log(doms)
//Object {length: 18, form: 1, div: 59, input: 102, script: 7…} 当前页面的元素和数量
}())