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

jQuery はコレクションオブジェクトです。コレクション内の各要素のすべての祖先要素をすばやく見つけたい場合は、parents() メソッドを使用できます。実際、これは find と child の違いと似ています。は 1 レベルのみを検索しますが、親は祖先ノードまで検索します

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

<li class="grandson"> ;1</li>
</ul>
</div>

li ノードで祖先要素 div を見つけます。ここでは $("li を使用できます。 ").parents() メソッド

parents() なしパラメータ

parents() メソッドを使用すると、DOM ツリー内でこれらの要素の祖先要素を検索し、上から順に要素を照合し、新しい jQuery オブジェクトを作成できます。一致した要素では、返された要素の順序は、最寄りの親要素から始まることです。jQueryはコレクションオブジェクトです。コレクションオブジェクトの場合、ターゲット要素を見つけるためにコレクションオブジェクトをフィルターする必要がある場合があるため、セレクター式を渡すことができます

注:

1.parents() と .parent () メソッドは似ています。ただし、後者は単一レベルの DOM ツリー検索のみを実行します

2 $( "html" ).parent() メソッドはドキュメントを含むコレクションを返しますが、$( "html" ).parents( ) は空のコレクションを返します。

コードの一部を見てみましょう:

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <script src="http://libs.baidu.com/jquery/1.9.1/jquery.js"></script>
</head>

<body>
    <div>php.cn
        <ul>php
          <li>php 中文网</li>
          <li>php 中文网</li>
        </ul>
    </div>
<script>
    $("li").parents().css('color','red');
</script>

</body>
</html>

学び続ける

新しいファイル

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

提出するリセットコード

自動運転