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使用正则验证15/18身份证的方法示例
Apr 27 jQuery
各种选择框jQuery的选中方法(实例讲解)
Jun 27 jQuery
jQuery EasyUI开发技巧总结
Sep 26 jQuery
jQuery简单实现向列表动态添加新元素的方法示例
Dec 25 jQuery
jQuery中内容过滤器简单用法示例
Mar 31 jQuery
jQuery实现图片简单轮播功能示例
Aug 13 jQuery
jQuery插件实现的日历功能示例【附源码下载】
Sep 07 jQuery
jQuery实现网页拼图游戏
Apr 22 jQuery
jQuery的ztree仿windows文件新建和拖拽功能的实现代码
Dec 05 jQuery
jQuery+vue.js实现的多选下拉列表功能示例
Jan 15 jQuery
jQuery与原生JavaScript选择HTML元素集合用法对比分析
Nov 26 jQuery
jquery实现轮播图特效
Apr 12 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者的疑难问答(2)
2006/10/09 PHP
美图秀秀web开放平台--PHP流式上传和表单上传示例分享
2014/06/22 PHP
php+mysql实现无限分类实例详解
2015/01/15 PHP
支持汉转拼和拼音分词的PHP中文工具类ChineseUtil
2018/02/23 PHP
js操作Xml(向服务器发送Xml,处理服务器返回的Xml)(IE下有效)
2009/01/30 Javascript
预加载css或javascript的js代码
2010/04/23 Javascript
解决js中window.open弹出的是上次的缓存页面问题
2013/12/29 Javascript
调试代码导致IE出错的避免方法
2014/04/04 Javascript
jQuery取消ajax请求的方法
2015/06/09 Javascript
一张Web前端的思维导图分享
2015/07/03 Javascript
javascript实现信息增删改查的方法
2015/07/25 Javascript
浅谈使用MVC模式进行JavaScript程序开发
2015/11/10 Javascript
JavaScript:Date类型全面解析
2016/05/19 Javascript
JavaScript的new date等日期函数在safari中遇到的坑
2016/10/24 Javascript
angular动态删除ng-repaeat添加的dom节点的方法
2017/07/20 Javascript
原生JS实现瀑布流插件
2018/02/06 Javascript
微信小程序实现图片滚动效果示例
2018/12/05 Javascript
vue实现鼠标经过动画
2019/10/16 Javascript
python执行子进程实现进程间通信的方法
2015/06/02 Python
Python对数据库操作
2016/03/28 Python
书单|人生苦短,你还不用python!
2017/12/29 Python
Python编程pygame模块实现移动的小车示例代码
2018/01/03 Python
替换python字典中的key值方法
2018/07/06 Python
详解python的四种内置数据结构
2019/03/19 Python
Django连接数据库并实现读写分离过程解析
2019/11/13 Python
python matplotlib如何给图中的点加标签
2019/11/14 Python
使用 django orm 写 exists 条件过滤实例
2020/05/20 Python
python+selenium实现12306模拟登录的步骤
2021/01/21 Python
澳大利亚制造的羊皮靴:Original UGG Boots
2017/11/13 全球购物
心理学专业大学生职业生涯规划范文
2014/02/19 职场文书
指导教师评语
2014/04/26 职场文书
员工安全生产责任书
2014/07/22 职场文书
技术员岗位职责范本
2015/04/11 职场文书
民事二审代理词
2015/05/25 职场文书
教你如何使用Python实现二叉树结构及三种遍历
2021/06/18 Python
SQL语法CONSTRAINT约束操作详情
2022/01/18 MySQL