深入理解$.each和$(selector).each

$.each：該方法用於遍歷任何集合，包括數組和對象

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

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

①遍歷數組

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

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

回調函數中：index 代表數組的索引，value 代表數組中的值

②遍歷Json對象

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

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

回調函數中：key 代表json對像中的key， value 代表json對像中的value

③遍歷Jquery對象

var doms = $("div");//Jquery對象本身是一個集合，通過索引的方式可以將Jquery對象轉換為Dom對象

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

回調函數中：index 代表Jquery對像中的索引， value 代表Jquery對像中的dom對象，也可以通過this得到同樣的dom對象

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

對於$.each方法可以通過在回調函數中return false退出循環，如果return true 則相當於for循環中的continue

疑問：為什麼$().each回調函數中的this不是Jquery對象而是Dom對象

由於$().each方法的本質是通過調用$.each實現的，通過分析$.each源碼可知，我們可以看到callback.apply(object[i++],args)這段代碼

對於$().each傳進去的object正是Jquery對象，而object[i++]將Jquery對象轉換為dom對象，再根據apply方法劫持對象的特性，那麼回調函數中的this就被改變成了dom對象

我們經常在Jquery插件中看到這種寫法，通過上面的分析，我想就應該懂了

$.fn.test = function(option){return this.each(function(){//這個this是Jquery對象alert(this);//而這個this卻是Dom對象})}

以上這篇深入理解$.each和$(selector).each就是小編分享給大家的全部內容了，希望能給大家一個參考，也希望大家多多支持武林網。