jQueryclosest ()メソッド

❮jQueryトラバースメソッド

<span>の最初の祖先、つまり<ul>要素を返します。

$(document).ready(function(){
  $("span").closest("ul").css({"color": "red", "border": "2px solid red"});
});

結果:

body (great-great-grandparent)
div (great-grandparent)
    ul (second ancestor - second grandparent)
      ul (first ancestor - first grandparent)
    • li (direct parent)  span  
     

定義と使用法

close()メソッドは、選択した要素の最初の祖先を返します。

祖先は、親、祖父母、曽祖父母などです。

DOMツリー:このメソッドは、現在の要素からドキュメントのルート要素(<html>)まで上向きにトラバースして、DOM要素の最初の祖先を見つけます。

このメソッドは、両方ともDOMツリーをトラバースするという点でparents()に似ています。違いは次のとおりです。

close()

  • 現在の要素で始まります
  • DOMツリーを上に移動し、渡された式に一致する最初の(単一の)祖先を返します
  • 返されるjQueryオブジェクトには0個または1個の要素が含まれています

両親()

  • 親要素で始まります
  • DOMツリーを上に移動し、渡された式に一致するすべての祖先を返します
  • 返されたjQueryオブジェクトには、0個または複数の要素が含まれています

その他の関連する方法:

  • parent() -選択した要素の直接の親要素を返します
  • 親Until() -2つの指定された引数の間のすべての祖先要素を返します


構文

選択した要素の最初の祖先を返します。

$(selector).closest(filter)

DOMコンテキストを使用して最初の祖先を返し、以下の中でDOMツリーを検索します。

$(selector).closest(filter,context)

Parameter Description
filter Required. Specifies a selector expression, element or jQuery object to narrow down the ancestor search
context Optional. A DOM element within which a matching element may be found

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


を返します。このメソッドは現在の要素から始まるため、<span>の最初の<span>を検索すると<span>が返されます。


コンテキストとしてDOM要素を渡す両方のパラメーターを使用して、最初の<ul>要素を検索するコンテキストとしてDOM要素を渡します。


❮jQueryトラバースメソッド