jQuery中map函數(shù)的兩種方式
更新時間：2017年04月07日 10:42:31 投稿：mrr
本文給大家分享jquery中map函數(shù)的兩種方式，非常不錯，具有參考借鑒價值，需要的朋友參考下吧
兩種方式：
1、直接jQuery.map
//將原數(shù)組中每個元素加 4 轉(zhuǎn)換為一個新數(shù)組。
$.map( [0,1,2], function(n){
return n + 4;
});
//結(jié)果:
[4, 5, 6]
//原數(shù)組中每個元素擴(kuò)展為一個包含其本身和其值加 1 的數(shù)組，并轉(zhuǎn)換為一個新數(shù)組
$.map( [0,1,2], function(n){
return [ n, n + 1 ];
});
//結(jié)果:
[0, 1, 1, 2, 2, 3]
2、遍歷對象.map
例子：
<form method="post" action="">
<fieldset>
<div>
<label for="two">2</label>
<input type="checkbox" value="2" id="two" name="number[]">
</div>
<div>
<label for="four">4</label>
<input type="checkbox" value="4" id="four" name="number[]">
</div>
<div>
<label for="six">6</label>
<input type="checkbox" value="6" id="six" name="number[]">
</div>
<div>
<label for="eight">8</label>
<input type="checkbox" value="8" id="eight" name="number[]">
</div>
</fieldset>
</form>
$(':checkbox').map(function() {
return this.id;
}).get().join(',');
結(jié)果：two,four,six,eight
解析：
map（）的功能主要有兩步， 第一步就是遍歷，第二步就是替換 。
$( " li " ).map( function(){
return $(this).text(); // 注意return關(guān)鍵字不可少
})
map先遍歷，每一項都返回一個text（）值 ，然后map會將這些值自動去替換$("li")集合的每一項值，所以 這個時候還是個類數(shù)組（因為還是$(" li ")的殼子），不是個真正的數(shù)組 。于是后面加個get（）操作就變成真正的數(shù)組了，于是可以用join（）這樣專屬于數(shù)組的方法。
以上所述是小編給大家介紹的jQuery中map函數(shù)的兩種方式，希望對大家有所幫助，如果大家有任何疑問歡迎給我留言，小編會及時回復(fù)大家的，在此也非常感謝大家對腳本之家網(wǎng)站的支持！
相關(guān)文章
JQuery判斷radio（單選框）是否選中和獲取選中值方法總結(jié)
這篇文章主要介紹了JQuery判斷radio（單選框）是否選中和獲取選中值方法總結(jié),本文講解了利用獲取選中值判斷選中、使用checked屬性判斷選中、jquery獲取radio單選按鈕的值、獲取一組radio被選中項的值、設(shè)置單選按鈕被選中等內(nèi)容,需要的朋友可以參考下2015-04-04
本文為大家詳細(xì)介紹下jQuery拖曵的簡單實例，具體的實現(xiàn)思路及代碼如下，感興趣的朋友可以參考下哈，希望對大家有所幫助2013-07-07
這篇文章主要介紹了jQuery點擊頁面其他部分隱藏下拉菜單功能,本文通過實例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值，需要的朋友可以參考下2018-11-11
jQuery實現(xiàn)手機(jī)版頁面翻頁效果的簡單實例
下面小編就為大家?guī)硪黄猨Query實現(xiàn)手機(jī)版頁面翻頁效果的簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-10-10
jQuery實現(xiàn)點擊下拉框中的值累加到文本框中的方法示例
這篇文章主要介紹了jQuery實現(xiàn)點擊下拉框中的值累加到文本框中的方法,涉及jQuery事件綁定及頁面元素屬性動態(tài)獲取與操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2017-10-10
這篇文章主要介紹了jQuery滾動加載圖片實現(xiàn)原理，通過四個方面來說明懶加載技術(shù)的原理，感興趣的小伙伴們可以參考一下2015-12-12
本篇文章主要介紹了jquery仿蘋果的時間/日期選擇效果的實例，具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03
讓jQuery Mobile不顯示討厭loading界面的方法
jQuery Mobile總是顯示討厭的loading界面，下面有個不錯的解決方法，大家可以參考下2014-02-02
一個基于Jquery的簡單&簡陋Tabs插件，學(xué)習(xí)的朋友可以參考下。2010-02-02
因為我的留言板是倒序，默認(rèn)又只會展開最新的5條留言，對于較舊留言甚至是沙發(fā)的同學(xué)，很容易被忽略掉。2009-06-06