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实现简单的手风琴效果
Apr 17 jQuery
jQuery实现QQ空间汉字转拼音功能示例
Jul 10 jQuery
jQuery+Ajax请求本地数据加载商品列表页并跳转详情页的实现方法
Jul 12 jQuery
使用JQuery实现图片轮播效果的实例(推荐)
Oct 24 jQuery
集成vue到jquery/bootstrap项目的方法
Feb 10 jQuery
jQuery实现表单动态添加与删除数据操作示例
Jul 03 jQuery
jQuery仿移动端支付宝键盘的实现代码
Aug 15 jQuery
使用jQuery给Table动态增加行、清空table的方法
Sep 05 jQuery
JS/jQuery实现获取时间的方法及常用类完整示例
Mar 07 jQuery
基于 jQuery 实现键盘事件监听控件
Apr 04 jQuery
jQuery zTree插件使用简单教程
Aug 16 jQuery
Jquery如何使用animation动画效果改变背景色的代码
Jul 20 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
实现在同一方法中获取当前方法中新赋值的session值解决方法
2014/06/26 PHP
通过PHP实现获取访问用户IP
2020/05/09 PHP
通过jQuery源码学习javascript(二)
2012/12/27 Javascript
鼠标选择动态改变网页背景颜色的JS代码
2013/12/10 Javascript
Jquery倒计时源码分享
2014/05/16 Javascript
ECMA5数组的新增方法有哪些及forEach()模仿实现
2015/11/03 Javascript
Javascript中常见的逻辑题和解决方法
2016/09/17 Javascript
BootStrap网页中代码显示用法详解
2016/10/21 Javascript
ES5 ES6中Array对象去除重复项的方法总结
2017/04/27 Javascript
jquery.picsign图片标注组件实例详解
2018/02/02 jQuery
M2实现Nodejs项目自动部署的方法步骤
2019/05/05 NodeJs
解决微信浏览器缓存站点入口文件(IIS部署Vue项目)
2019/06/17 Javascript
jQuery HTML css()方法与css类实例详解
2020/05/20 jQuery
JavaScript实现答题评分功能页面
2020/06/24 Javascript
[03:06]3分钟带你回顾DOTA2完美盛典&完美大师赛
2017/12/06 DOTA
python 队列详解及实例代码
2016/10/18 Python
python使用__slots__让你的代码更加节省内存
2018/09/05 Python
Python面向对象程序设计构造函数和析构函数用法分析
2019/04/12 Python
如何运行.ipynb文件的图文讲解
2019/06/27 Python
Pyinstaller加密打包应用的示例代码
2020/06/11 Python
pytorch实现查看当前学习率
2020/06/24 Python
Python结合百度语音识别实现实时翻译软件的实现
2021/01/18 Python
HTML5使用ApplicationCache接口实现离线缓存技术解决离线难题
2012/12/13 HTML / CSS
canvas仿写贝塞尔曲线的示例代码
2017/12/29 HTML / CSS
Groupon比利时官方网站:特卖和网上购物高达-70%
2019/08/09 全球购物
FirstCry阿联酋儿童和婴儿产品网上购物:FirstCry.ae
2021/02/22 全球购物
社区包粽子活动方案
2014/01/21 职场文书
中学生差生评语
2014/01/30 职场文书
党支部换届选举方案
2014/05/08 职场文书
2015年学校后勤工作总结
2015/04/08 职场文书
考勤制度通知
2015/04/25 职场文书
教师继续教育反思周记
2015/06/25 职场文书
《圆的周长》教学反思
2016/02/17 职场文书
go web 预防跨站脚本的实现方式
2021/06/11 Golang
船舶调度指挥系统——助力智慧海事
2022/02/18 无线电
html网页引入svg图片的4种方式
2022/08/05 HTML / CSS