jQuery トラバーサル Children() メソッド

jQuery はコレクションオブジェクトです。コレクション内の最初のレベルの子要素をすばやく見つけたい場合は、children() メソッドを使用できます。

ここに注意してください: .children(selector) メソッドは、一致する要素セット内の各要素のすべての子要素を返します (親子関係として理解できる息子の世代のみ)

ノード検索の関係を理解します:

<div class="div">
" " t;

上記のコード: $("div").children() の場合、div と ul には ul のみが見つかることを意味します。親子関係があり、li と div は祖先関係があるため、見つけることができません。

children() にはパラメータがありません

を使用すると、DOM ツリー内でこれらの要素の直接の子要素を検索し、一致する要素の新しい jQuery オブジェクトを構築できます

注: jQuery はコレクションオブジェクトであるため、子を渡すことは Combine です各要素の最初のレベルのサブ要素

Children() メソッドで同じ種類のセレクター式

$("div") を選択する必要がある場合もあります。コレクションオブジェクトをフィルターしてターゲット要素を見つけるため、セレクター式を渡すことができます

以下に例を書いてみましょう:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>childred()</title>
    <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>
<body>
    <div>
        <ul>
            <li>php.cn</li>
            <li>php 中文网</li>
        </ul>

        <p>  php </p>
    </div>


    <script>
        $("div").children().css("color", "red");
    </script>
</body>
</html>

上記のコードは、Go to $("div").children() と記述します。 css("color", "red"); すると、div の下の子要素が検索されるため、div 内の要素が赤になります。上記のコードを使用すると、色が変化することがわかります。 p タグ内の要素は変更されていません。children() にパラメータがあるため、first が最初の要素です。したがって、div 内の最初の子要素が見つかります

<ul> がdiv の最初の要素なので、li タグ内の要素が変更されます。コードをローカルに記述して試すことができます

。

学び続ける

新しいファイル

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>childred()</title> <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script> </head> <body> <div> <ul> <li>php.cn</li> <li>php 中文网</li> </ul> <p> php </p> </div> <script> $("div").children().css("color", "red"); </script> </body> </html>

提出するリセットコード

自動運転