jQuery 遍歷map()方法詳解
一、定義和用法
map()
把每個(gè)元素通過(guò)函數(shù)傳遞到當(dāng)前匹配集合中,生成包含返回值的新的 jQuery 對(duì)象。
二、語(yǔ)法
.map(callback(index,domElement))
三、詳細(xì)說(shuō)明
由于返回值是 jQuery 封裝的數(shù)組,使用 get()
來(lái)處理返回的對(duì)象以得到基礎(chǔ)的數(shù)組
四、案例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>jquery map</title> <script language="javascript" src="../jquery-1.11.1.js"></script> <script language="javascript"> $(function(){ //map 遍歷數(shù)組 var str = $.map([1, 2, 3], function(n){ //console.log(n); return n; }).join(); // console.log(str); // var data = $('#list li').map(function(){ //console.log($(this).attr('id')); return $(this).attr('id'); }).get().join(); console.log(data); }); </script> </head> <body> <div> <ul id="list"> <li id="li1">列表1</li> <li id="li2">列表2</li> <li id="li3">列表3</li> <li id="li4">列表4</li> <li id="li5">列表5</li> </ul> </div> </body> </html>
總結(jié)
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能有所幫助,如果有疑問(wèn)大家可以留言交流。
相關(guān)文章
jQuery動(dòng)畫(huà)效果-fadeIn fadeOut淡入淺出示例代碼
jQuery動(dòng)畫(huà)效果淡入淺出想必大家都有見(jiàn)到過(guò)吧,其實(shí)很很簡(jiǎn)單,通過(guò)fadeIn fadeOut方法便可輕松實(shí)現(xiàn),具體如下,喜歡的朋友可以參考下,希望對(duì)大家有所幫助2013-08-08jquery 實(shí)現(xiàn)checkbox全選,反選,全不選等功能代碼(奇數(shù))
jquery 實(shí)現(xiàn)全選,反選,全不選等功能,下面直接以例子進(jìn)行說(shuō)明,需要的朋友可以參考下2012-10-10Jquery實(shí)現(xiàn)多選下拉列表左右移動(dòng)
這篇文章主要為大家詳細(xì)介紹了Jquery實(shí)現(xiàn)多選下拉列表左右移動(dòng),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-02-02easyUI 實(shí)現(xiàn)的后臺(tái)分頁(yè)與前臺(tái)顯示功能示例
這篇文章主要介紹了easyUI 實(shí)現(xiàn)的后臺(tái)分頁(yè)與前臺(tái)顯示功能,結(jié)合實(shí)例形式分析了easyUI 后臺(tái)數(shù)據(jù)交互、分頁(yè)與前臺(tái)顯示相關(guān)操作技巧及注意事項(xiàng),需要的朋友可以參考下2020-06-06jquery異步調(diào)用頁(yè)面后臺(tái)方法‏(asp.net)
給出了兩個(gè)簡(jiǎn)單的例子,無(wú)參數(shù)的和有參數(shù)的,返回的都是json數(shù)據(jù)。2011-03-03juqery 學(xué)習(xí)之三 選擇器 可見(jiàn)性 元素屬性
juqery 學(xué)習(xí)之三 選擇器 可見(jiàn)性 元素屬性,需要的朋友可以參考下。2010-11-11基于jQuery實(shí)現(xiàn)圖片推拉門(mén)動(dòng)畫(huà)效果的兩種方法
本文給大家分享兩種方法實(shí)現(xiàn)''推拉門(mén)''動(dòng)畫(huà)效果也可以稱(chēng)作是手風(fēng)琴效果,具體實(shí)現(xiàn)方法大家通過(guò)本文一起學(xué)習(xí)吧2017-08-08AJAX和jQuery動(dòng)態(tài)加載數(shù)據(jù)的實(shí)現(xiàn)方法
本文給大家介紹使用ajax和jquery動(dòng)態(tài)加載數(shù)據(jù)的實(shí)現(xiàn)方法,使用jQuery可以簡(jiǎn)化這個(gè)過(guò)程。下面通過(guò)實(shí)例代碼給大家介紹下,需要的的朋友參考下吧2016-12-12基于jquery實(shí)現(xiàn)表格無(wú)刷新分頁(yè)
這篇文章主要介紹了基于jquery實(shí)現(xiàn)表格無(wú)刷新分頁(yè),功能實(shí)現(xiàn)了前端排序功能,增加了前端搜索功能,感興趣的小伙伴們可以參考一下2016-01-01Jquery的Tabs內(nèi)容輪換效果實(shí)現(xiàn)代碼,幾行搞定
本篇文章主要是對(duì)Jquery的Tabs內(nèi)容輪換效果的實(shí)現(xiàn)代碼進(jìn)行了介紹。幾行代碼輕松搞定2014-02-02