jQuery中$.each使用詳解
通過它,你可以遍歷對(duì)象、數(shù)組的屬性值并進(jìn)行處理。
使用說明
each函數(shù)根據(jù)參數(shù)的類型實(shí)現(xiàn)的效果不完全一致:
1、遍歷對(duì)象(有附加參數(shù))
$.each(Object, function(p1, p2) { this; //這里的this指向每次遍歷中Object的當(dāng)前屬性值 p1; p2; //訪問附加參數(shù) }, ['參數(shù)1', '參數(shù)2']);
2、遍歷數(shù)組(有附件參數(shù))
$.each(Array, function(p1, p2){ this; //這里的this指向每次遍歷中Array的當(dāng)前元素 p1; p2; //訪問附加參數(shù) }, ['參數(shù)1', '參數(shù)2']);
3、遍歷對(duì)象(沒有附加參數(shù))
$.each(Object, function(name, value) { this; //this指向當(dāng)前屬性的值 name; //name表示Object當(dāng)前屬性的名稱 value; //value表示Object當(dāng)前屬性的值 });
4、遍歷數(shù)組(沒有附加參數(shù))
$.each(Array, function(i, value) { this; //this指向當(dāng)前元素 i; //i表示Array當(dāng)前下標(biāo) value; //value表示Array當(dāng)前元素 });
下面提一下jQuery的each方法的幾種常用的用法
Js代碼
var arr = [ "one", "two", "three", "four"]; $.each(arr, function(){ alert(this); }); //上面這個(gè)each輸出的結(jié)果分別為:one,two,three,four var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]] $.each(arr1, function(i, item){ alert(item[0]); }); //其實(shí)arr1為一個(gè)二維數(shù)組,item相當(dāng)于取每一個(gè)一維數(shù)組, //item[0]相對(duì)于取每一個(gè)一維數(shù)組里的第一個(gè)值 //所以上面這個(gè)each輸出分別為:1 4 7 var obj = { one:1, two:2, three:3, four:4}; $.each(obj, function(key, val) { alert(obj[key]); }); //這個(gè)each就有更厲害了,能循環(huán)每一個(gè)屬性 //輸出結(jié)果為:1 2 3 4
本文就先到這里了,簡(jiǎn)單描述下jQuery中。$.each的使用方法,希望小伙伴們能夠喜歡。
- 詳解JavaScript中的forEach()方法的使用
- JavaScript中的數(shù)組遍歷forEach()與map()方法以及兼容寫法介紹
- JavaScript forEach()遍歷函數(shù)使用及介紹
- JavaScript使用forEach()與jQuery使用each遍歷數(shù)組時(shí)return false 的區(qū)別
- 在JavaScript中操作數(shù)組之map()方法的使用
- Javascript中Array.prototype.map()詳解
- js 自帶的 map() 方法全面了解
- js/jquery遍歷對(duì)象和數(shù)組的方法分析【forEach,map與each方法】
- Jquery遍歷篩選數(shù)組的幾種方法和遍歷解析json對(duì)象,Map()方法詳解以及數(shù)組中查詢某值是否存在
- 原生JS forEach()和map()遍歷的區(qū)別、兼容寫法及jQuery $.each、$.map遍歷操作
相關(guān)文章
jQuery+slidereveal實(shí)現(xiàn)的面板滑動(dòng)側(cè)邊展出效果
WEB開發(fā)中有時(shí)需要在頁面上設(shè)置一個(gè)控制面板,默認(rèn)是不顯示的,當(dāng)用戶有需要時(shí)可以通過按鈕觸發(fā)調(diào)用面板展示。常見的有頁面?zhèn)冗吇雒姘逍Ч?。本文將使用jQuery插件并結(jié)合實(shí)例給大家介紹一下面板滑動(dòng)展示效果。2015-03-03jquery中$.post()方法的簡(jiǎn)單實(shí)例
本篇文章主要是對(duì)jquery中$.post()方法的簡(jiǎn)單實(shí)例進(jìn)行了介紹,需要的朋友可以過來參考下,希望對(duì)大家有所幫助2014-02-02使用jQuery插件創(chuàng)建常規(guī)模態(tài)窗口登陸效果
隱藏模態(tài)窗口技術(shù)是一種很好的解決方案,用于處理不是特有必要出現(xiàn)在網(wǎng)頁上的界面元素,下面與大家分享下如何利用jQuery插件leanModal建立一個(gè)常規(guī)模態(tài)窗口2013-08-08基于jquery實(shí)現(xiàn)左右按鈕點(diǎn)擊的圖片切換效果
這篇文章主要介紹了基于jquery實(shí)現(xiàn)左右按鈕點(diǎn)擊的圖片切換效果,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2015-11-11jquery表單驗(yàn)證框架提供的身份證驗(yàn)證方法(示例代碼)
本篇文章主要介紹了jquery表單驗(yàn)證框架提供的身份證驗(yàn)證方法的示例代碼。需要的朋友可以過來參考下,希望對(duì)大家有所幫助2013-12-12優(yōu)秀js開源框架-jQuery使用手冊(cè)(1)
優(yōu)秀js開源框架-jQuery使用手冊(cè)(1)...2007-03-03iframe異步加載實(shí)現(xiàn)點(diǎn)擊左邊菜單加載右邊內(nèi)容實(shí)例講解
iframe異步加載想必很多朋友對(duì)你都不會(huì)陌生,接下來將實(shí)現(xiàn)這樣一個(gè)功能左邊菜單不能刷新的情況下,異步加載右邊的內(nèi)容頁面,感興趣的你可以參考下本文或許對(duì)你有所幫助2013-03-03