jQuery.each()用法分享

更新時(shí)間：2012年07月31日 21:48:25 作者：

昨天寫(xiě)了個(gè)小插件，用到這個(gè)方法，不太明白$.each()這個(gè)方法，今天查了下手冊(cè)，學(xué)習(xí)一下

例遍數(shù)組，同時(shí)使用元素索引和內(nèi)容。（i是索引，n是內(nèi)容）

 
$.each( [0,1,2], function(i, n){ 
alert( "Item #" + i + ": " + n ); 
}); 

例遍對(duì)象，同時(shí)使用成員名稱(chēng)和變量?jī)?nèi)容。（i是成員名稱(chēng)，n是變量?jī)?nèi)容）

復(fù)制代碼代碼如下:

 
$.each( { name: "John", lang: "JS" }, function(i, n){ 
alert( "Name: " + i + ", Value: " + n ); 
}); 

例遍dom元素，此處以一個(gè)input表單元素作為例子。

如果你dom中有一段這樣的代碼
<input name="aaa" type="hidden" value="111" />
<input name="bbb" type="hidden" value="222" />
<input name="ccc" type="hidden" value="333" />
<input name="ddd" type="hidden" value="444"/>
然后你使用each如下

復(fù)制代碼代碼如下:

 
$.each($("input:hidden"), function(i,val){ 
alert(val); //輸出[object HTMLInputElement]，因?yàn)樗且粋€(gè)表單元素。 
alert(i); //輸出索引為0，1，2，3 
alert(val.name); //輸出name的值 
alert(val.value); //輸出value的值 
}); 

以下是官方的解釋?zhuān)?

jQuery.each(object, [callback])

概述
通用例遍方法，可用于例遍對(duì)象和數(shù)組。

不同于例遍 jQuery 對(duì)象的 $().each() 方法，此方法可用于例遍任何對(duì)象?；卣{(diào)函數(shù)擁有兩個(gè)參數(shù)：第一個(gè)為對(duì)象的成員或數(shù)組的索引，第二個(gè)為對(duì)應(yīng)變量或內(nèi)容。如果需要退出 each 循環(huán)可使回調(diào)函數(shù)返回 false，其它返回值將被忽略。

參數(shù)
objectObject
需要例遍的對(duì)象或數(shù)組。

callback (可選)Function
每個(gè)成員/元素執(zhí)行的回調(diào)函數(shù)。

您可能感興趣的文章:

jQuery
each

相關(guān)文章

jQuery使用children()找到特定元素的子元素
children()是jQuery中的內(nèi)置方法,用于查找與所選元素相關(guān)的所有子元素,?jQuery中的children()方法向下遍歷到所選元素的單個(gè)級(jí)別并返回所有元素,我們還可以在children()的參數(shù)中添加過(guò)濾器、使用children()來(lái)定位特定的子元素以及使用each()方法來(lái)迭代子元素等
2023-11-11
關(guān)于jQuery里prev()的簡(jiǎn)單操作代碼
這篇文章主要介紹了jQuery里prev()的簡(jiǎn)單操作代碼,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-10-10
jquery.ajax的url中傳遞中文亂碼問(wèn)題的解決方法
本篇文章主要是對(duì)jquery.ajax的url中傳遞中文亂碼問(wèn)題的解決方法進(jìn)行了介紹，需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助
2014-02-02
jQuery實(shí)現(xiàn)的仿百度分頁(yè)足跡效果代碼
這篇文章主要介紹了jQuery實(shí)現(xiàn)的仿百度分頁(yè)足跡效果代碼,采用jQuery針對(duì)奇偶數(shù)不同的頁(yè)碼設(shè)置不同的樣式,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下
2015-10-10
jquery中ajax學(xué)習(xí)筆記3
由于很多知識(shí)都已經(jīng)做了詳細(xì)介紹，本節(jié)只介紹需要修改的代碼，使用jqery封裝的ajax使用XML格式接收服務(wù)器端的數(shù)據(jù)，web.xml、后臺(tái)的servet都不用改
2011-10-10
jQuery獲取父元素節(jié)點(diǎn)、子元素節(jié)點(diǎn)及兄弟元素節(jié)點(diǎn)的方法
這篇文章主要介紹了jQuery獲取父元素節(jié)點(diǎn)、子元素節(jié)點(diǎn)及兄弟元素節(jié)點(diǎn)的方法,結(jié)合實(shí)例形式總結(jié)分析了jQuery節(jié)點(diǎn)操作的相關(guān)技巧,需要的朋友可以參考下
2016-04-04
jquery實(shí)現(xiàn)點(diǎn)擊左右按鈕切換圖片
這篇文章主要為大家詳細(xì)介紹了jquery實(shí)現(xiàn)點(diǎn)擊左右按鈕切換圖片，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-01-01
BootStrap table表格插件自適應(yīng)固定表頭(超好用)
這篇文章主要介紹了BootStrap table表格插件自適應(yīng)固定表頭(超好用)的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-08-08
jQuery實(shí)現(xiàn)的卷簾門(mén)滑入滑出效果【案例】
這篇文章主要介紹了jQuery實(shí)現(xiàn)的卷簾門(mén)滑入滑出效果,結(jié)合具體實(shí)例形式分析了jQuery事件綁定及slideToggle方法實(shí)現(xiàn)滑入滑出效果相關(guān)操作技巧,需要的朋友可以參考下
2019-02-02
解決IE7中使用jQuery動(dòng)態(tài)操作name問(wèn)題
IE7中無(wú)法使用Jquery動(dòng)態(tài)操作頁(yè)面元素的name屬性，怎么解決這個(gè)問(wèn)題呢？下面小編給大家?guī)?lái)了解決IE7中使用jQuery動(dòng)態(tài)操作name問(wèn)題，需要的朋友參考下吧
2017-08-08