$.each：該方法用于遍歷任何集合，包括數(shù)組和對(duì)象

$(selector).each:該方法用于遍歷Jquery對(duì)象

語(yǔ)法：$.each(obj,callback,args)

①遍歷數(shù)組

var arry = ["a","b","c","d",…];

$.each(arry,function(index,value){…})

回調(diào)函數(shù)中：index 代表數(shù)組的索引 ，value 代表數(shù)組中的值

②遍歷Json對(duì)象

var json = {key1:value1, key2:value2, key3:value3}

$.each(json, function(key,value){…})

回調(diào)函數(shù)中：key 代表json對(duì)象中的key， value 代表json對(duì)象中的value

③遍歷Jquery對(duì)象

var doms = $("div");//Jquery對(duì)象本身是一個(gè)集合，通過(guò)索引的方式可以將Jquery對(duì)象轉(zhuǎn)換為Dom對(duì)象

$.each(doms, function(index,value){..})

回調(diào)函數(shù)中：index 代表Jquery對(duì)象中的索引， value 代表Jquery對(duì)象中的dom對(duì)象，也可以通過(guò)this得到同樣的dom對(duì)象

對(duì)于③還有另外一種寫(xiě)法就是 $("div").each(function(index,value){…})

對(duì)于$.each方法可以通過(guò)在回調(diào)函數(shù)中return false退出循環(huán)，如果return true 則相當(dāng)于for循環(huán)中的continue

疑問(wèn)：為什么$().each回調(diào)函數(shù)中的this不是Jquery對(duì)象 而是Dom對(duì)象

由于$().each方法的本質(zhì)是通過(guò)調(diào)用$.each實(shí)現(xiàn)的，通過(guò)分析$.each源碼可知，我們可以看到callback.apply(object[i++],args)這段代碼

對(duì)于$().each傳進(jìn)去的object正是Jquery對(duì)象，而object[i++]將Jquery對(duì)象轉(zhuǎn)換為dom對(duì)象，再根據(jù)apply方法劫持對(duì)象的特性，那么回調(diào)函數(shù)中的this就被改變成了dom對(duì)象

我們經(jīng)常在Jquery插件中看到這種寫(xiě)法，通過(guò)上面的分析，我想就應(yīng)該懂了

$.fn.test = function(option){

return this.each(function(){//這個(gè)this是Jquery對(duì)象

alert(this);//而這個(gè)this卻是Dom對(duì)象

})

}

以上這篇深入理解$.each和$(selector).each就是小編分享給大家的全部?jī)?nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

最新評(píng)論