Jquery中find與each方法用法實(shí)例
本文實(shí)例講述了Jquery中find與each方法用法。分享給大家供大家參考。具體如下:
一、find()方法
jquery選擇器非常強(qiáng)大,利用css的命名規(guī)約,可以更快更方便的找出想要的元素。
比如:
$("#id") $("#"+"id") $(this) $(element)
等等,只要靈活運(yùn)用,就能爆發(fā)出強(qiáng)大的可造型。
但是在實(shí)際使用中,仍然覺(jué)得有些不足。
如果想要在某個(gè)元素下尋找特定的元素,僅僅依靠上面這個(gè)方法,就必須對(duì) $("#id")獲取的元素進(jìn)行遍歷,獲取其子元素。如此一來(lái)就顯得格外的繁瑣,代碼量也非常龐大。
于是這就需要用到find()方法。
$("#id").find("#child"); $("#id").find(".child"); $("#id").find("input[type='image']");
非常方便好用。
除了上面的find()方法之外,還有一種查找子元素的方法。
$(".child",parent);
這種方法與find()方法的結(jié)果是一樣的,也更加簡(jiǎn)潔。
我們舉個(gè)例子:
function(table){ $("tr",table).css("background-color","red"); }
這種方法,方便代碼的重用,更符合閉包的寫法。
二、each()方法
有的時(shí)候經(jīng)常會(huì)用到數(shù)組。在不知道each()方法前,如果碰到數(shù)組遍歷,我一般都是這么寫的:
var arr = new Array(); arr.push(1); arr.push(2); arr.push(3); for(var i =0;i<arr.length;i++) { (function(m){ console.log(this); })(i); }
多么繁瑣?。?!現(xiàn)在又了each(),生活從此變輕松?! ?/p>
上面的這段代碼,只要一句話。
var arr = new Array(); arr.push(1); arr.push(2); arr.push(3); arr.each(function(){ console.log(this); });
使用each之后,結(jié)構(gòu)立馬變得簡(jiǎn)潔優(yōu)雅起來(lái)。
希望本文所述對(duì)大家的jQuery程序設(shè)計(jì)有所幫助。
- jQuery中find()方法用法實(shí)例
- Jquery中的層次選擇器與find()的區(qū)別示例介紹
- 基于jquery中children()與find()的區(qū)別介紹
- jQuery初學(xué):find()方法及children方法的區(qū)別分析
- jQuery find和children方法使用
- Jquery find與filter函數(shù)區(qū)別 說(shuō)明
- JQuery 選擇器、過(guò)濾器介紹
- 使用jquery選擇器如何獲取父級(jí)元素、同級(jí)元素、子元素
- Jquery顏色選擇器ColorPicker實(shí)現(xiàn)代碼
- Jquery選擇器中使用變量實(shí)現(xiàn)動(dòng)態(tài)選擇例子
- jquery選擇器排除某個(gè)DOM元素的方法(實(shí)例演示)
- jQuery中Find選擇器用法示例
相關(guān)文章
jQuery 錨點(diǎn)跳轉(zhuǎn)滾動(dòng)條平滑滾動(dòng)一句話代碼
jQuery 錨點(diǎn)跳轉(zhuǎn)滾動(dòng)條平滑滾動(dòng)一句話代碼,需要的朋友可以參考下。2010-04-04JSONP 跨域訪問(wèn)代理API-yahooapis實(shí)現(xiàn)代碼
介紹一個(gè)JSONP 跨域訪問(wèn)代理API-yahooapis,需要的朋友可以參考下2012-12-12Query中click(),bind(),live(),delegate()的區(qū)別
這篇文章主要介紹了Query中click(),bind(),live(),delegate()之間的區(qū)別。需要的朋友可以過(guò)來(lái)參考下,希望對(duì)大家有所幫助2013-11-11JQuery標(biāo)簽頁(yè)效果實(shí)例詳解
這篇文章主要介紹了JQuery標(biāo)簽頁(yè)效果,結(jié)合實(shí)例形式較為詳細(xì)的分析了jQuery響應(yīng)鼠標(biāo)事件動(dòng)態(tài)遍歷及切換標(biāo)簽頁(yè)的技巧,需要的朋友可以參考下2015-12-12基于jQuery實(shí)現(xiàn)收縮展開(kāi)功能
這篇文章主要介紹了基于jQuery實(shí)現(xiàn)收縮展開(kāi)功能的相關(guān)資料,需要的朋友可以參考下2016-03-03jQuery 學(xué)習(xí)入門篇附實(shí)例代碼
這篇文章比較不錯(cuò),更重要的是一些實(shí)例代碼,對(duì)于想學(xué)習(xí)jquery的朋友是個(gè)不錯(cuò)的資料。2010-03-03基于jQuery+Cookie實(shí)現(xiàn)的防止刷新的在線考試倒計(jì)時(shí)
這篇文章主要介紹了基于jQuery+Cookie實(shí)現(xiàn)的防止刷新的在線考試倒計(jì)時(shí)的方法和示例,有需要的小伙伴可以參考下2015-06-06