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 11 jQuery
jQuery使用eraser.js插件实现擦除、刮刮卡效果的方法【附eraser.js下载】
Apr 28 jQuery
jQuery实现可拖动进度条实例代码
Jun 21 jQuery
jQuery获取table表中的td标签(实例讲解)
Jul 28 jQuery
jQuery实现的文字逐行向上间歇滚动效果示例
Sep 06 jQuery
jQuery实现的页面遮罩层功能示例【测试可用】
Oct 14 jQuery
jQuery封装animate.css的实例
Jan 04 jQuery
jQuery实现的简单歌词滚动功能示例
Jan 07 jQuery
基于jquery实现的tab选项卡功能示例【附源码下载】
Jun 10 jQuery
jQuery列表动态增加和删除的实现方法
Nov 05 jQuery
jquery实现广告上下滚动效果
Mar 04 jQuery
html中两种获取标签内的值的方法
Jun 16 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
flash用php连接数据库的代码
2011/04/21 PHP
php 文件上传类代码
2011/08/06 PHP
php 转换字符串编码 iconv与mb_convert_encoding的区别说明
2011/11/10 PHP
php 批量生成html,txt文件的实现代码
2013/06/26 PHP
js获取变量
2006/08/24 Javascript
JS获取IUSR_机器名和IWAM_机器名帐号的密码
2006/12/06 Javascript
神奇的代码 通杀各种网站-可随意修改复制页面内容
2008/07/17 Javascript
jQuery表格行换色的三种实现方法
2011/06/27 Javascript
jquery重新播放css动画所遇问题解决
2013/08/21 Javascript
node.js中的buffer.write方法使用说明
2014/12/10 Javascript
JS面向对象(3)之Object类,静态属性,闭包,私有属性, call和apply的使用,继承的三种实现方法
2016/02/25 Javascript
探寻JavaScript中this指针指向
2016/04/23 Javascript
极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg
2016/05/27 Javascript
Bootstrap 附加导航(Affix)插件实例详解
2016/06/01 Javascript
JavaScript事件学习小结(五)js中事件类型之鼠标事件
2016/06/09 Javascript
AngularJS基础 ng-show 指令简单示例
2016/08/03 Javascript
Vue.js实现一个自定义分页组件vue-paginaiton
2016/09/05 Javascript
详解jQuery lazyload 懒加载
2016/12/19 Javascript
Vue cli构建及项目打包以及出现的问题解决
2018/08/27 Javascript
使用p5.js临摹动态图片
2019/11/04 Javascript
element-ui 文件上传修改文件名的方法示例
2019/11/05 Javascript
js实现AI五子棋人机大战
2020/05/28 Javascript
PyQT实现菜单中的复制,全选和清空的功能的方法
2019/06/17 Python
Python库skimage绘制二值图像代码实例
2020/04/10 Python
python tkinter的消息框模块(messagebox,simpledialog)
2020/11/07 Python
德国古洛迷亚百货官网:GALERIA Kaufhof
2017/06/20 全球购物
后进生转化工作制度
2014/01/17 职场文书
工程专业应届生求职信
2014/02/19 职场文书
《桂花雨》教学反思
2014/04/12 职场文书
无犯罪记录证明
2014/09/19 职场文书
科学育儿宣传标语
2014/10/08 职场文书
毕业生就业推荐表导师评语
2014/12/31 职场文书
2015夏季作息时间调整通知
2015/04/24 职场文书
推荐六本经典文学奖书籍:此生必读
2019/08/22 职场文书
PHP基本语法
2021/03/31 PHP
Mysql数据库索引面试题(程序员基础技能)
2021/05/31 MySQL