ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery の場合: 子のみのセレクターの使用例 example_jquery

jQuery の場合: 子のみのセレクターの使用例 example_jquery

WBOY
リリース: 2016-05-16 16:22:32
オリジナル
1190 人が閲覧しました

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

このセレクターは、親要素の唯一の子要素と一致します。親要素に他の要素が含まれている場合、その要素は一致しません。

文法構造:

コードをコピーします コードは次のとおりです:
$(":only-child")

このセレクターは通常、クラス セレクター、要素セレクターなどの他のセレクターと組み合わせて使用​​されます。。例:

コードをコピー コードは次のとおりです:
$("li:only-child").css("color "、" ブルー")

上記のコードは、ul 要素の下の li 要素のフォントの色を 1 つの li 要素だけを青に設定できます。

注: 上記のコードと組み合わせて概念を説明する必要があります。ここで言う親要素は li ではなく、li の親要素です。 li 要素の子要素の最後の要素と一致すると勘違いしている人がよくいます。

コード例:

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



<頭>


スクリプト ホーム

<スクリプトタイプ="text/javascript"> $(document).ready(function(){
$("ボタン").click(function(){
$("li:only-child").css("color","blue")
})
})





  • ASP チュートリアル



  • html チュートリアル

  • DIV CSS チュートリアル

  • jQUERY チュートリアル

  • jAVAScript チュートリアル







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

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート