< h1>"/> タイトル
< h1>">

ホームページ  >  記事  >  ウェブフロントエンド  >  DOM のノードとリレーションシップのプロパティの概要

DOM のノードとリレーションシップのプロパティの概要

PHP中文网
PHP中文网オリジナル
2017-06-21 13:20:591100ブラウズ
<!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>

ノード: ページ内のノードタグ、テキスト、コメント。 。 。これらはすべてノードです​​

childNodes: すべての子ノードを取得します

children: すべての要素の子ノードを取得します

parentNode: 親ノードを取得します

previousSibling: 前の兄弟ノードを取得します

nextSibling: 次の弟ノードを取得します

firstChild: すべての子ノードの最初を取得します

lastChild: すべての子ノードの最後のノードを取得します

js でマスターする必要があるノードの種類:

In-in-22 In-in-22 in in in In In In her her hers Children メソッドは、指定された要素の下にある要素の子ノードを取得するために使用されます

要素を取得する すべての兄弟要素ノード

<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>

以上がDOM のノードとリレーションシップのプロパティの概要の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。