ホームページ > ウェブフロントエンド > jsチュートリアル > jQueryの親要素と親nodesを取得するメソッドのまとめ_jquery

jQueryの親要素と親nodesを取得するメソッドのまとめ_jquery

WBOY
リリース: 2016-05-16 15:05:32
オリジナル
2578 人が閲覧しました

この記事の例は、jQuery の親要素と親ノードを取得する方法をまとめたものです。参考のために皆さんと共有してください。詳細は次のとおりです:

jquery では、parent()、parents()、closest() など、親要素を取得する方法がたくさんあります。以下で 1 つずつ説明していきます。

まず例を挙げてみましょう。

<ul class="parent1">
<li><a href="#" id="item1">jquery获取父节点</a></li> 
<li><a href="#">jquery获取父元素</a></li> 
</ul>

ログイン後にコピー
私たちの目的は、ID item1 のメモ a を通じてクラスparent1 の ul 要素を取得することです。

1. 親([expr])

一致するすべての要素の一意の親要素を含む要素のセットを取得します。

オプションの式を使用してフィルタリングできます。

コードは次のとおりです

$('#item1').parent().parent('.parent1');

ログイン後にコピー

2. :親

子要素またはテキストを含む要素と一致します

コードは次のとおりです

$('li:parent');

ログイン後にコピー

3. 親([expr])

一致するすべての要素 (ルート要素を除く) の祖先要素を含む要素のセットを取得します。オプションの式でフィルタリングできます。

コードは次のとおりです

$('#items').parents('.parent1');

ログイン後にコピー

4. 最も近い([expr])

closest は、まず現在の要素が一致するかどうかを確認し、一致する場合は要素自体を直接返します。一致するものがない場合は、セレクターに一致する要素が見つかるまで、レイヤーごとに親要素を上方向に検索します。何も見つからない場合は、空の jQuery オブジェクトが返されます。

最も近い親と親の主な違いは次のとおりです:

① 前者は現在の要素からマッチングと検索を開始し、後者は親要素からマッチングと検索を開始します。 ② 前者は、一致する要素が見つかるまで上方向に検索し、停止します。その後、これらの要素を一時コレクションに入れ、指定されたセレクター式を使用してフィルターします。 ③ 前者は 0 または 1 つの要素を返しますが、後者は 0、1、または複数の要素を含む可能性があります。


closest は、イベントの委任を処理する場合に便利です。

さらに jQuery 関連のコンテンツに興味のある読者は、このサイトの特別トピック「
$('#items1').closest('.parent1');

ログイン後にコピー
JQuery トラバーサル アルゴリズムとスキルの概要
」、「

jQuery テーブル (テーブル) 操作のスキルの概要」を参照してください。 " 、"jQuery のドラッグ効果とテクニックのまとめ"、"jQuery 拡張テクニックのまとめ"、"jQuery の一般的な古典的な特殊効果のまとめ" 、「jQuery アニメーションと特殊効果の使い方まとめ」、「jQuery セレクターの使い方まとめ」、「jQuery の共通プラグインと使い方まとめ この記事が jQuery プログラミングのすべての人に役立つことを願っています。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート