Zusammenfassung der Knoten- und Beziehungseigenschaften im DOM-js-Tutorial-php.cn

Zusammenfassung der Knoten- und Beziehungseigenschaften im DOM

PHP中文网

Freigeben： 2017-06-21 13:20:59

Original

1146 Leute haben es durchsucht

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="div1">
        <h1>培训课程</h1>
        <ul>
            <li>html+css</li>
            <li>javascript</li>
            <li>正式课</li>
            <li>移动端课程</li>
            <li>node.js正式课</li>
        </ul>
    </div>
    <script>//获取关系的属性var oDiv = document.getElementById("div1");
        console.log(oDiv.childNodes);//获取所有的子节点console.log(oDiv.children);//获取所有的元素子节点</script>
</body>
</html>

Nach dem Login kopieren

Knoten: Knoten-Tags, Text, Kommentare auf einer Seite. . . Sie sind alle Knoten

childNodes: Alle untergeordneten Knoten abrufen

children: Alle untergeordneten Elementknoten abrufen

parentNode: Holen Sie sich den übergeordneten Knoten

previousSibling: Holen Sie sich den vorherigen Bruderknoten

nextSibling: Holen Sie sich den nächsten Bruderknoten

firstChild: Den ersten aller untergeordneten Knoten abrufen

lastChild: Den letzten aller untergeordneten Knoten abrufen

Die Knotentypen, die wir in js beherrschen müssen: 🎜>Elementknoten (Elementbezeichnung) 1 Tag-Name null

Textknoten (Text) 3　　#comment　　　Kommentarinhalt

Dokument　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　　melden Sie sich bei uns an Textknoten

Methode: Simulieren Sie die Methode unserer Kinder, um den untergeordneten Elementknoten unter dem angegebenen Element

Das vorherige Bruderelement eines Elements abrufen. Untergeordnete Knoten 　 Alle Bruderelementknoten eines Elements abrufen

<em><em><span style="color: #008000">       /        * getMyChildren:获取制定元素下的所有的元素节点<em><em><em>        * @parameter：</em></em></em> <br>　　*   ele:我们要获取谁下面的，就把谁传过来<br>　　　　　　　tagName:获取元素的类型
        * @return:
        *   我们最后获取的元素子节点
        *   by xxxxxxxxx
        * </span><span style="color: #008000">*/</span><span style="color: #0000ff">function</span><span style="color: #000000"> getMyChildren(ele,tagName){</span><span style="color: #0000ff">var</span> ary = [],nodes =<span style="color: #000000"> ele.childNodes;</span><span style="color: #0000ff">for</span>(<span style="color: #0000ff">var</span> i = 0;i<nodes.length;i++<span style="color: #000000">){</span><span style="color: #0000ff">var</span> cur =<span style="color: #000000"> nodes[i];</span><span style="color: #0000ff">if</span>(cur.nodeType===1<span style="color: #000000">){<br>　　　　　　　　　　　　if(tagName){<br>　　　　　　　　　　　　　　if(cur.nodeName.toLowerCase===tagName.toLowerCase){<br>　　　　　　　　　　　　　　　　ary.push(cur)<br>　　　　　　　　　　　　　　}<br>　<br>　　　　　　　　　　　　}else{<br></span></em></em>

Nach dem Login kopieren

 　　　　　　　　　　　　ary.push(cur);

Nach dem Login kopieren

　　　　　　　　　　　　}
                   
                }
            }return ary;

        }

Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonZusammenfassung der Knoten- und Beziehungseigenschaften im DOM. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!