jQuery 過滤 - 祖先

祖先は父、祖父、曾祖父などです。

jQueryを使用して、DOM木を上りに遍历し、要素の祖先を検索することができます。

DOM木を上りに遍历

これらのjQueryメソッドは非常に便利で、DOM木を上りに遍历するために使用されます：

  • parent()
  • parents()
  • parentsUntil()

jQuery parent()メソッド

parent()メソッドは、選択された要素の直接の親要素を返します。

このメソッドはDOM木に対して一階にのみ遍历します。

以下の例では、各<span>要素の直接の親要素を返します：

例

$(document).ready(function(){
  $("span").parent();
});

自分で試してみてください

jQuery parents()メソッド

parents()メソッドは、選択された要素のすべての祖先要素を返し、それがドキュメントのルート要素(<html>)まで上り続けます。

以下の例では、すべての<span>要素のすべての祖先要素を返します：

例

$(document).ready(function(){
  $("span").parents();
});

自分で試してみてください

オプションの引数を使用して、祖先要素の検索をフィルタリングすることもできます。

以下の例では、すべての<span>要素のすべての祖先要素を返し、それが<ul>要素であることを示します：

例

$(document).ready(function(){
  $("span").parents("ul");
});

自分で試してみてください

jQuery parentsUntil()メソッド

parentsUntil()メソッドは、2つの指定された要素間のすべての祖先要素を返します。

以下の例では、<span>と<div>要素間のすべての祖先要素を返します：

例

$(document).ready(function(){
  $("span").parentsUntil("div");
});

自分で試してみてください

jQuery 遍历リファレンスマニュアル

すべての jQuery 遍历メソッドについて詳しく知りたい場合は、私たちの jQuery 遍历リファレンスマニュアル。