最新のWeb開発のチュートリアル
 

jQueryトラバース - 祖先を


祖先は、というように、親、祖父母、曽祖父である、と。

jQueryのを使用すると、要素の先祖を見つけるために、DOMツリーをトラバースすることができます。


DOMツリーをトラバース

DOMツリーをトラバースするための3つの便利なjQueryのメソッドは次のとおりです。

  • 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");
});
»それを自分で試してみてください

練習で自分自身をテスト!

演習1» 演習2» 演習3» 演習4»


jQueryのトラバースリファレンス

すべてのjQueryトラバース・メソッドの完全な概要については、当社をご覧くださいjQueryのトラバースリファレンス