ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery階層セレクター

jQuery階層セレクター

无忌哥哥
无忌哥哥オリジナル
2018-06-29 11:11:211817ブラウズ

//1. 子孫: space

  $('li a').addClass('green')

//2. すべての子要素>

//ulの子要素liの前景色のみが赤くなり、孫要素3499910bf9dac5ae3c52d5ede7383485のテキストは変更されません。

$('ul > *').addClass('red')

/ /スペースで区切ると、25edfb22a4f469ecb59f1190150159c63499910bf9dac5ae3c52d5ede7383485 の前景色がすべて変わります

$('ul  *').css('color','red')

//3 隣接する兄弟要素 +

は、6 番目の前の li の次の兄弟になります。 li 景色が緑色に変わります

$('li:nth-child(5) + li').addClass('green')

//4. すべての兄弟要素~

$('li:nth-child(5) ~ li').addClass('green')

//5. 最初と最後の要素

  $('li:first-child').addClass('green')
  $('li:first').addClass('green')
  $('li:last-child').css('color','red')
  $('li:last').css('color','red')

//7. 以上を選択します。特定のシリアル番号より小さい要素

//最初にすべての要素のクラスを削除します

  $('li:nth-child(6)').addClass('red')
  //jquery使用eq(i),i从0开始,注意与css中的不一样
  $('li:eq(5)').addClass('red')

//li の下の a を除いて li のみを削除します。リンクは緑色のままです

  $('*').removeClass()

//シリアル番号より大きい要素をすべて選択します4 より大きい場合、計算は 0 から始まることに注意してください

  $('li').removeClass()

// 8 未満のシリアル番号を持つすべての要素を選択します

$('li:gt(3)').addClass('red')

// シリアル番号の特性に基づいて要素を選択します

// 偶数のシリアル番号を持つすべての要素を選択します Even

/ /0、0、2、、4 から始まるので、奇数を選択したように見えますので、ご注意ください

$('li:lt(7)').addClass('red')

//奇数を選択するということは奇数を意味すると推測しているかもしれません。そうだよ

そうだね

以上がjQuery階層セレクターの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。