jQueryclosest ()メソッド
例
<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個または複数の要素が含まれています
その他の関連する方法:
構文
選択した要素の最初の祖先を返します。
$(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要素を渡します。