javascript - jqueryこのconcatセレクター

Question

たとえば、このHTMLが与えられた場合：

<div>
    <p>p0</p>
    <p>p1</p>
    <p>p2</p>
</div>

this連結されたjQueryセレクターの書き方がわかりません。これは次のようなものです。

$("div").on("mouseover", function () {
    $(this + " p").css({
        color: "#009"
    });
}); 

これの正しい構文は何ですか？

Answer 1

別の要素内の要素を検索するには、コンテキストセレクターを使用します。これを試して：

$("p", this).css({ /* ... */ });

または、親のを連結することもできますid-これは少し醜いIMOですが：

$("#" + this.id + " p").css({ /* ... */ });

find()または、親要素で使用できます。

$(this).find("p").css({ /* ... */ });

上記のいずれでもうまくいきますが、2番目の例はかなり醜いので避ける必要があります。可能な場合は常にthis参照を直接使用してください。

Answer 2

jQueryセレクターは、「セレクターコンテキスト」と呼ばれるオプションの2番目の引数を取ります。jQueryドキュメントから：

デフォルトでは、セレクターはドキュメントルートから始まるDOM内で検索を実行します。ただし、関数のオプションの2番目のパラメーターを使用して、検索に代替コンテキストを指定できます$()...内部的には、セレクターコンテキストは.find()メソッドで実装されるため、$('span', this)と同等$(this).find('span')です。

答え：あなたはあなたの代わりに、$("p", this)または同等に（しかしより冗長に）必要です。これにより、に含まれる要素の子孫要素であるsに選択が制限されます。$(this).find("p")$(this+" p")<p>this

Answer 3

$('p', this)基本的にすべてのpタグをthisコンテキストで返すものを探していると思います。