Jquery $.map使用方法实例详解


Posted in jQuery onSeptember 01, 2020

$.map() 函数用于使用指定函数处理数组中的每个元素(或对象的每个属性),并将处理结果封装为新的数组返回。

注意:

1. 在jQuery 1.6 之前,该函数只支持遍历数组;从 1.6 开始,该函数也支持遍历对象。

2. map()还会为函数传入两个参数:其一是当前迭代的元素或属性值,其二是当前迭代项的数组索引或对象属性名。

3. 该函数返回值将作为结果数组中的一个元素,如果返回值为null或undefined,则不会被添加到结果数组中。

$.map(data,function(item,index){return XXX})

遍历data数组中的每个元素,并按照return中的计算方式 形成一个新的元素,放入返回的数组中

var b = $.map( [55,1,2], function( item,index ) { return { "label": item, "value": index }});
            alert(b[0].label +" "+ b[0].value);

[55,1,2]是一个数组,按照return的条件,,,,function 中的item,为55时,index也就是数组的下标就为0

$.map()括号中就相当于一个循环

循环多条数据,把数据定义为b

var array = [0, 1, 52, 97];
array = $.map(array, function(a, index) {
 return [a - 45, index];
});

输出为:

[-45, 0, -44, 1, 7, 2, 52, 3]

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
Mar 22 jQuery
利用jquery正则表达式在页面验证url网址输入是否正确
Apr 04 jQuery
jQuery表单验证之密码确认
May 22 jQuery
jQuery的时间datetime控件在AngularJs中的使用实例(分享)
Aug 17 jQuery
jQuery实现火车票买票城市选择切换功能
Sep 15 jQuery
jQuery实现的简单无刷新评论功能示例
Nov 08 jQuery
jQuery替换节点元素的操作方法
Mar 18 jQuery
jQuery 实现批量提交表格多行数据的方法
Aug 09 jQuery
jQuery的Ajax接收java返回数据方法
Aug 11 jQuery
jQuery+CSS实现的标签页效果示例【测试可用】
Aug 14 jQuery
jQuery中event.target和this的区别详解
Aug 13 jQuery
jQuery实现影院选座订座效果
Apr 13 jQuery
JQuery基于FormData异步提交数据文件
Sep 01 #jQuery
JQuery使用数组遍历跳出each循环
Sep 01 #jQuery
JS JQuery获取data-*属性值方法解析
Sep 01 #jQuery
jQuery实现动态加载瀑布流
Sep 01 #jQuery
js和jquery判断数据类型的4种方法总结
Aug 28 #jQuery
jQuery编写QQ简易聊天框
Aug 27 #jQuery
jQuery实现简单QQ聊天框
Aug 27 #jQuery
You might like
PHP Zip解压 文件在线解压缩的函数代码
2010/05/26 PHP
利用PHP fsockopen 模拟POST/GET传送数据的方法
2015/09/22 PHP
ThinkPHP框架实现数据增删改
2017/05/07 PHP
php的单例模式及应用场景详解
2021/02/27 PHP
File文件控件,选中文件(图片,flash,视频)即立即预览显示
2009/04/09 Javascript
监控 url fragment变化的js代码
2010/04/19 Javascript
几个有趣的Javascript Hack
2010/07/24 Javascript
Js切换功能的简单方法
2010/11/23 Javascript
与jquery serializeArray()一起使用的函数,主要来方便提交表单
2011/01/31 Javascript
jquery 表格的增行删行实现思路
2013/03/21 Javascript
raphael.js绘制中国地图 地图绘制方法
2014/02/12 Javascript
JS高级调试技巧:捕获和分析 JavaScript Error详解
2014/03/16 Javascript
javascript 拷贝节点cloneNode()使用介绍
2014/04/03 Javascript
JQuery中serialize()、serializeArray()和param()方法示例介绍
2014/07/31 Javascript
JavaScript Math.floor方法(对数值向下取整)
2015/01/09 Javascript
JavaScript显示当前文档最后修改日期的方法
2015/03/19 Javascript
jQuery使用prepend()方法在元素前添加内容用法实例
2015/03/26 Javascript
Javascript中的作用域和上下文深入理解
2015/07/03 Javascript
微信JS-SDK选取手机照片上传功能
2017/04/21 Javascript
Javascript的this详解
2019/03/23 Javascript
express如何解决ajax跨域访问session失效问题详解
2019/06/20 Javascript
[01:38]2018DOTA2亚洲邀请赛主赛事第二日现场采访 神秘商人痛陈生计不易
2018/04/05 DOTA
[00:23]魔方之谜解锁款式
2018/12/20 DOTA
git使用.gitignore设置不生效或不起作用问题的解决方法
2017/06/01 Python
解决nohup执行python程序log文件写入不及时的问题
2019/01/14 Python
Python3安装Pillow与PIL的方法
2019/04/03 Python
使用 Python 玩转 GitHub 的贡献板(推荐)
2019/04/04 Python
在Python中过滤Windows文件名中的非法字符方法
2019/06/10 Python
Python计算一个点到所有点的欧式距离实现方法
2019/07/04 Python
python对绑定事件的鼠标、按键的判断实例
2019/07/17 Python
pycharm下pyqt4安装及环境配置的教程
2020/04/24 Python
技术总监个人的自我评价范文
2013/12/18 职场文书
男方父母证婚词
2014/01/12 职场文书
激励口号大全
2014/06/17 职场文书
2015选调生工作总结
2015/07/24 职场文书
解析laravel使用workerman用户交互、服务器交互
2021/04/28 PHP