站長資訊網
        最全最豐富的資訊網站

        map在jquery中的用法是什么

        用法:1、用于將元素通過函數傳遞到集合中,生成新的jQuery對象,語法為“.map(callback(index,domElement))”;2、用于處理數組中的元素并將結果封裝為新數組返回,語法為“$.map(數組或對象,指定函數)”。

        map在jquery中的用法是什么

        本教程操作環境:windows10系統、jquery3.2.1版本、Dell G3電腦。

        map在jquery中的用法

        1、map() 把每個元素通過函數傳遞到當前匹配集合中,生成包含返回值的新的 jQuery 對象。

        語法

        .map(callback(index,domElement))

        callback(index,domElement) 對當前集合中的每個元素調用的函數對象。

        由于返回值是 jQuery 封裝的數組,使用 get() 來處理返回的對象以得到基礎的數組。

        示例如下:

        <!DOCTYPE html> <html> <head>   <style>p { color:red; }</style>   <script type="text/javascript" src="/jquery/jquery.js"></script> </head> <body>   <p><b>Values: </b></p>   <form>     <input type="text" name="name" value="John"/>     <input type="text" name="password" value="password"/>     <input type="text" name="url" value="http://php.cn/"/>   </form> <script>     $("p").append( $("input").map(function(){       return $(this).val();     }).get().join(", ") ); </script> </body> </html>

        輸出結果:

        map在jquery中的用法是什么

        2、$.map() 函數用于使用指定函數處理數組中的每個元素(或對象的每個屬性),并將處理結果封裝為新的數組返回。

        在jQuery 1.6 之前,該函數只支持遍歷數組;從 1.6 開始,該函數也支持遍歷對象。

        map()還會為函數傳入兩個參數:其一是當前迭代的元素或屬性值,其二是當前迭代項的數組索引或對象屬性名。

        該函數返回值將作為結果數組中的一個元素,如果返回值為null或undefined,則不會被添加到結果數組中。

        $.map( object, callback )

        object Array/Object類型 指定的需要處理的數組或對象。

        callback Function類型 指定的處理函數。

        示例如下:

        <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>123</title> <style> div { color:blue; } p { color:green; margin:0; } span { color:red; } </style> <script src="js/jquery.min.js"></script> </head> <body> <div></div> <p></p> <span></span> <script> $(function () {  var arr = [ "a", "b", "c", "d", "e" ]; $("div").text(arr.join(", ")); arr = $.map(arr, function(n, i){ return (n.toUpperCase() + i); }); $("p").text(arr.join(", ")); arr = $.map(arr, function (a) { return a + a; }); $("span").text(arr.join(", ")); }) </script>   </body> </html>

        輸出結果:

        map在jquery中的用法是什么

        相關視頻教程推薦:jQuery視頻教程

        贊(0)
        分享到: 更多 (0)
        網站地圖   滬ICP備18035694號-2    滬公網安備31011702889846號
        主站蜘蛛池模板: 日韩人妻无码精品久久久不卡| 精品三级AV无码一区| 无码精品A∨在线观看| 国产精品久久久天天影视香蕉 | 久久国产精品久久| 最新精品露脸国产在线| 亚洲第一精品福利| 91精品美女在线| 久久精品国产99久久久| 亚洲中文久久精品无码| 久久综合精品国产一区二区三区| 柠檬福利精品视频导航| 精品无码国产污污污免费网站 | 精品无码久久久久久国产| 午夜精品美女自拍福到在线| www国产精品| 国产在线精品无码二区| 国产精品对白刺激久久久| 1000部精品久久久久久久久| 精品无码AV一区二区三区不卡| 一区二区国产精品| 日产国产精品亚洲系列| 精品人妻伦一二三区久久| 国产在线精品一区二区高清不卡 | 国产成人精品日本亚洲网站| 久久精品欧美日韩精品| 无码少妇精品一区二区免费动态| 午夜国产精品无套| 亚洲精品色婷婷在线影院| 亚洲福利精品电影在线观看| 日韩精品视频在线观看免费| 无码精品第一页| 亚洲国产av无码精品| 无码精品久久一区二区三区| 最新精品露脸国产在线 | 国产精品1024在线永久免费| 四虎永久在线精品国产免费 | 精品国产粉嫩内射白浆内射双马尾| 亚洲无线观看国产精品| 亚洲精品无码成人AAA片| 无码国内精品人妻少妇蜜桃视频|