17.09 JQuery親要素&&兄弟要素&&子要素セレクタ
3058 ワード
まず例コードをください.以下の説明に便利です.
一.親要素を取得します.parent(selector) && .parents(selector) && parentsUntil();セレクタオプション
1.現在一致する要素の親要素を取得します.parent(selector)、たとえば
さらに増加することもできます
当たり前のように
もちろんこのように使うことをお勧めしません.長すぎて、きれいではありません.まだ効率がありませんか.0.0 2.現在の一致する要素の各祖先要素を取得します.parents(selector)、たとえば
単に1つの「s」を追加するだけで、以上の取得はaラベルのすべての祖先要素であり、ul、div、body、html、ドキュメントの根元までを含む.このように、このセレクタを使用する場合、ブラシを追加することが多い.
3.parentsUntil()は、リフレッシュが一致するオブジェクト(セレクタが一致するオブジェクトを含まない)まで、現在の一致する要素の各祖先要素のセットを取得します.
注意:ブラシは必須で、parentsUntilの「U」は大文字で、親測小文字は無効で、アルパカの名前(以下同)
二.兄弟要素を取得します.next() && .nextAll() && .andSelf() && .prev() && .prevAll();5つだけで類似性があります
1.現在一致するエレメントの次の兄弟エレメントを取得します.next()
もちろんつなぎ合わせることもできます!
2.現在一致する要素以下のすべての兄弟要素を取得する.次のように
これにブラシを加えるともっと使いやすくなります.
3.現在の一致要素を含む、現在の一致要素の下にあるすべての兄弟要素を取得します.
4.残りprev() && .prevAll()は言わない、と.next() && .nextAll()は似ていますが、nextは下、prevは上です.(上に自分を含めてないみたい?まあ~下に自分を含めても使えるとは限らない)
三.サブエレメントの取得
1.>,これは例を挙げて説明しなければならない
段階的に進めなければならないので,級を越えて書くのは役に立たない. .children()は、一致する要素の子要素(息子、孫などが転がっているだけ)を得る .find()は、現在の一致する要素の子孫要素を得るために、ブラシは必ず選択され、これは使いやすく、何世代おきに見つけることができます(効率は高くありませんか?)
これで全部お話しします.複数のセレクタを組み合わせて、つなぎ合わせて使うと、いつも欲しい要素のオブジェクトが見つかりますよね?
-
-
-
-
-
-
一.親要素を取得します.parent(selector) && .parents(selector) && parentsUntil();セレクタオプション
1.現在一致する要素の親要素を取得します.parent(selector)、たとえば
$('.the_test').parent() // a , 4 li
さらに増加することもできます
$('.the_test').parent().parent() // ul
当たり前のように
$('.the_test').parent().parent().parent() // div
もちろんこのように使うことをお勧めしません.長すぎて、きれいではありません.まだ効率がありませんか.0.0 2.現在の一致する要素の各祖先要素を取得します.parents(selector)、たとえば
$('.the_test').parents() // ul、div、body、html
単に1つの「s」を追加するだけで、以上の取得はaラベルのすべての祖先要素であり、ul、div、body、html、ドキュメントの根元までを含む.このように、このセレクタを使用する場合、ブラシを追加することが多い.
$('.the_test').parents('li') // 4 li
$('.the_test').parents('div') // 4 div
3.parentsUntil()は、リフレッシュが一致するオブジェクト(セレクタが一致するオブジェクトを含まない)まで、現在の一致する要素の各祖先要素のセットを取得します.
$('.the_test').parentsUntil('ul') // 4 li
注意:ブラシは必須で、parentsUntilの「U」は大文字で、親測小文字は無効で、アルパカの名前(以下同)
二.兄弟要素を取得します.next() && .nextAll() && .andSelf() && .prev() && .prevAll();5つだけで類似性があります
1.現在一致するエレメントの次の兄弟エレメントを取得します.next()
$('.the_test').next() // 2 a
もちろんつなぎ合わせることもできます!
$('.the_test').next().next() // 3 a
2.現在一致する要素以下のすべての兄弟要素を取得する.次のように
$('.the_test').nextAll() // 2、3、4 a
これにブラシを加えるともっと使いやすくなります.
$('.the_test').nextAll('.the_test2') // 4 a
3.現在の一致要素を含む、現在の一致要素の下にあるすべての兄弟要素を取得します.
$('.the_test').andSelf() // a
$('.the_test').andSelf('.the_test2') // 1、4 a
4.残りprev() && .prevAll()は言わない、と.next() && .nextAll()は似ていますが、nextは下、prevは上です.(上に自分を含めてないみたい?まあ~下に自分を含めても使えるとは限らない)
三.サブエレメントの取得
1.>,これは例を挙げて説明しなければならない
$('.the_ul > li') // ul li
段階的に進めなければならないので,級を越えて書くのは役に立たない.
$('.the_ul > a') //false,
$('.the_ul > li > a') //true, a
$('.the_ul').children() // li
$('.the_li').children('.the_test') // 1 a
$('div').find('.the_test') // div , 1 a
これで全部お話しします.複数のセレクタを組み合わせて、つなぎ合わせて使うと、いつも欲しい要素のオブジェクトが見つかりますよね?