jQuery經常使用 遍歷函數

jQuery 遍歷函數包括了用於篩選、查找和串聯元素的方法。本文主要介紹平常工做中經常使用的JQ遍歷，
幫助一下初學者快速的接觸遍歷函數，提升本身的代碼編寫速度，寫出更簡潔更實用的代碼，
祝前端的同窗們，在前端這條沒有盡頭的路上漸行漸遠。
若是有什麼不對的地方 你們多提意見 互相學習 相互參考！！！

1.each()
　 語法：$(selector).each(function(index,element))
　 實例：$('li').each(
　　　　$(this).css(color,#c10000);
　　)
　　拆分一個數組，併爲每一個數組中的匹配元素，定義方法。

2.eq()
　語法：.eq(index)  //index表明的是整數 最小爲0 表明第一個對應元素
 實例：$("#nav ul").find("li").addClass("blod"); //找到id爲nav 裏面的ul裏面的li 找到第3個li併爲它加上一個.blod樣式.
　　
　　一般找到的li 都是一個數組 eq() 方法是把其中你想要的那個單獨提出來進行修改 樣式增長.eq(2)

3.find()
　 語法：.find(selector) //selector表明的是字符串值，包含供匹配當前元素集合的選擇器表達式。
　 實例：$("#nav ul").find("li").addClass("blod"); //找到id爲nav 裏面的ul裏面的全部li併爲它加上一個.blod樣式.　　

　　 方法得到當前元素集合中每一個元素的後代，經過選擇器、jQuery 對象或元素來篩選。

 

4.next(selector)
　語法：.next(selector) //seLector表明的是字符串值，包含用於匹配元素的選擇器表達式。

　實例：$("#nav ul").next("div") //找到id爲nav 裏面的ul 找到ul標籤下面的第一個div標籤
　　
　　next() 得到匹配元素集合中每一個元素緊鄰的同胞元素。若是提供選擇器，則取回匹配該選擇器的下一個同胞元素。

 

5.first()
　語法：.first()  
　實例：$("#nav ul").first("li").addClass("blod"); //找到id爲nav 下的ul下的li 找到第1個li併爲它加上一個.blod樣式.
　　
　　first() 將匹配元素集合縮減爲集合中的第一個元素。

 

6.parent()
　語法：.parent(seletor) //seLector表明的是字符串值，包含用於匹配元素的選擇器表達式。

　實例：$("#nav ul").parent("div").addClass("blod"); //找到id爲nav 下的ul的父級元素div 爲它加上一個.blod樣式.　　
　　parent() 得到當前匹配元素集合中每一個元素的父元素，使用選擇器進行篩選是可選的。

7.parents()
　語法：.parents(seletor) 

　實例：$("#nav ul").parents("div").addClass("blod"); //找到id爲nav 下的ul的祖先元素div 爲它加上一個.blod樣式.
   parents() 得到當前匹配元素集合中每一個元素的祖先元素，使用選擇器進行篩選是可選的。

八、siblings() 　　

　語法：.parents(seletor) 

　實例：$("#nav ul").first("li").siblings().addClass("blod"); //找到id爲nav 下的ul的第一個li 爲除了這個li之外的全部加上一個.blod樣式.

  siblings() 得到匹配集合中每一個元素的同胞，經過選擇器進行篩選是可選的。

 

 

轉載請註明出處~~ snper博客園