jQuery遍歴ノードメソッド要約

科学技術優家2017-05-14 17:22
1.childrenメソッド:$('div').children---div要素のすべてのサブ要素ノードを検索する

1 
Hello
 2 
 3 Hello Again 4 
  !
 5 
 6 
And Again
 7 8  9 $('div').children; //<span>Hello Again</span><p class="box">  !</p> 10 $('div').children('.box') //<p class="box">  !</p> 11 

2.nextメソッド:$('div').next---div要素を検索した後、隣接する兄弟要素を検索しますが、すべての兄弟要素ではありません.
[関連メソッド]
(1)nextallメソッド:$('div').nextall----div以降のすべての兄弟要素を検索
(2)nextUntilメソッド:$('div').nextUntil('p')----divを検索してからp要素のすべての同級要素まで

1 
Hello
 2 
Hello Again
 3 
 4 And Again 5 
 6 7  8 $('p').next; //<p>Hello Again</p><div><span>And Again</span></div> 9 $('p').next('.box'); //<p class="box">Hello Again</p> 10 

3.prevメソッド:$('div').prev----divの前に隣接する兄弟要素を検索
[関連メソッドはあります]
(1)prevAllメソッド:$('div').prevAll----div以前のすべての兄弟要素を検索
(2)prevUntilメソッド:$('div').prevUntil('p')---divを検索する前にp要素のすべての要素まで

1 
Hello
 2 
 3 Hello Again 4 
 5 
And Again
 6 7  8 $('p').prev; //<div><span>Hello Again</span></div> 9 

4.siblings方法:$('div').Siblings----div前後のすべての同級要素を検索
5.findメソッド:$('div').find('span')----div要素内のサブ要素を検索し、span要素です.
6.eqメソッド:$('div').eq(1)---2番目のdiv要素を検索(インデックスの下付きは0から)
7.firstメソッド:$('li').first---最初のli要素を取得
8.last方法:$('li').Last---最後のli要素を取得
9.filterメソッド:$('div').filter('.box')---クラス名boxのdiv要素を取得
10.isメソッド:$('.box').is('div')----判断.boxがdiv要素かどうか
11.mapメソッド:$('div').map(callback)---divごとにcallback関数を実行
例:input要素を巡ってvalue値を取得し、p要素の後ろに「,」で区切って追加

Values: 
 

$("p").append( $("input").map(function{ return $(this).val; }).get.join(", ") );//<p>John, password, http://ejohn.org/</p>
12.hasClassメソッド:$('div').hasClass(‘box’)----クラス名boxを含むdivを検索
13.has方法:$('div').has('span')----span要素が包まれたdiv要素を検索
14.not方法:$('div').not('span')----span要素を含まないdiv要素を検索
15.slice方法:$('p').slice(0,2)----1番目のp要素から3番目のp要素を検索
16.offsetParentメソッド:$('p').offsetParent---p要素の最初の位置付けされた祖先要素を検索します
17.parentメソッド:$('p').parent----p要素を含む唯一の親ノードの要素セットを返す
18.parentsメソッド:$('p').parent----p要素を含むすべての祖先ノード(ルートノードを含まない)を返します.
19.parentUntilメソッド:$('p').parentUntil('#box')----p要素の祖先レベルの要素を#boxまで検索
20.contentsメソッド:$('div').contents---div要素内のすべてのサブノード(テキストノードを含む)を返します.
21.end方法:$('div').find('span').end----文の主体を前の状態に戻す、すなわちspan要素を見つけた後、div要素にフォーカスを戻す

 Hello, how are you? 
  $('div').find('span').addClass('test').end.attr('title','title1'); //span  class=test;div  title=title1