1. 程式人生 > 其它 >js遍歷dom節點樹

js遍歷dom節點樹

技術標籤:js

遍歷dom節點,需要先弄清楚 nodeName->節點名字nodeType->節點型別—>1:元素節點3->文字節點nodeValue->節點內容

例如:在html裡

    <h1>遍歷dom節點樹</h1>
    <p>我是父節點
        <text>我是子節點</text>
    </p>
      //獲取根節點
        let root = document.documentElement;
        forDom(root);
        function forDom(root1){
            //獲取根節點下的子節點
            let children = root1.children;
            //呼叫遍歷位元組點
            forChildren(children);
        }
        //列印節點名字函式
        function fnName(node) {
            console.log('我是節點名字', node.nodeName);
        }
        function forChildren(children) {
            for(child of children){
                //列印位元組的名字
                fnName(child);
                //child.children 判斷是否存在子節點裡還有子節點,如果有,就繼續遍歷
                child.children && forDom(child);
            }
        }

列印如下: