jQuery の場合: セレクターの使用例あり example_jquery

この記事の例では、jQuery での has セレクターの使用法について説明します。皆さんの参考に共有してください。具体的な分析は次のとおりです。

このセレクターは、セレクターによって一致する要素を含む要素と一致します。

文法構造:

コードをコピー コードは次のとおりです:

$(":has(selector)")

このセレクターの定義は少しわかりにくいかもしれませんが、要素にセレクター (セレクター) と一致する要素が含まれている場合、この要素は一致します。例:

コードをコピーします コードは次のとおりです:

$("div:has(p)")

上記のセレクターは、p 要素を含む div 要素と一致します。
このセレクターは通常、クラス セレクター、要素セレクターなどの他のセレクターと組み合わせて使用​​されます。。例:

コードをコピー コードは次のとおりです:

$("div:has(p)").css("色"、"青")

上記のコードは、p 要素を含む div 要素のフォントの色を青に設定します。
他のセレクターと一緒に使用しない場合、デフォルトの状態は * セレクターとともに使用されます。たとえば、$(":has") は $("*:has") と同等です。

パラメータリスト:

参数	描述
selector	一个用于筛选的选择器。

コード例:

例 1:

コードをコピーします コードは次のとおりです:

<頭>





<スクリプトタイプ="text/javascript"> $(document).ready(function(){
$("ボタン").click(function(){
$("div:has(span)").css("border","1px 単色赤")
})
})

span は含めません

私は span
クリックして効果を確認してください

上記のコードは、span 要素を含む div の境界線の色を赤に設定できます。
例 2:

コードをコピーします コードは次のとおりです:

<頭>





<スクリプトタイプ="text/javascript"> $(document).ready(function(){
$("ボタン").click(function(){
$("*:has(span)").css("border","1px 単色赤")
})
})

span は含めません

私はspan

私はspan

クリックして効果を確認してください




上記のコードでは、:has セレクターで使用されるセレクターが指定されていないため、デフォルトで * セレクターで使用されます。そのため、上記のコードは、すべての Span 要素を含むすべての要素の境界線の色を赤に設定できます。

この記事が皆さんの jQuery プログラミングに役立つことを願っています。