jQuery 遍历map()方法详解


Posted in Javascript onNovember 04, 2016

一、定义和用法

map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象。

二、语法

.map(callback(index,domElement))

三、详细说明

由于返回值是 jQuery 封装的数组,使用 get() 来处理返回的对象以得到基础的数组

四、案例:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jquery map</title>
<script language="javascript" src="../jquery-1.11.1.js"></script>
<script language="javascript">
 $(function(){
 
 //map 遍历数组
 var str = $.map([1, 2, 3], function(n){
 //console.log(n);
 return n;
 }).join();
 //
 console.log(str);
 
 //
 var data = $('#list li').map(function(){
 //console.log($(this).attr('id'));
 return $(this).attr('id');
 }).get().join();
 
 console.log(data);
 });
</script>
</head>
<body>
 
 <div>
  <ul id="list">
   <li id="li1">列表1</li>
   <li id="li2">列表2</li>
   <li id="li3">列表3</li>
   <li id="li4">列表4</li>
   <li id="li5">列表5</li>
  </ul>
 </div>
 
</body>
</html>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能有所帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
使用JavaScript和C#中获得referer
Nov 14 Javascript
JS运动基础框架实例分析
Mar 03 Javascript
JS实现合并两个数组并去除重复项只留一个的方法
Dec 17 Javascript
完美实现八种js焦点轮播图(下篇)
Apr 20 Javascript
Javascript for in的缺陷总结
Feb 03 Javascript
vue-cli+webpack记事本项目创建
Apr 01 Javascript
angular实现spa单页面应用实例
Jul 10 Javascript
在knockoutjs 上自己实现的flux(实例讲解)
Dec 18 Javascript
vuex提交state&amp;&amp;实时监听state数据的改变方法
Sep 16 Javascript
详解在vue-test-utils中mock全局对象
Nov 07 Javascript
js中apply和call的理解与使用方法
Nov 27 Javascript
在vue中使用el-tab-pane v-show/v-if无效的解决
Aug 03 Javascript
Sortable.js拖拽排序使用方法解析
Nov 04 #Javascript
jQuery图片加载显示loading效果
Nov 04 #Javascript
JavaScript 深层克隆对象详解及实例
Nov 03 #Javascript
jQuery.ajax实现根据不同的Content-Type做出不同的响应
Nov 03 #Javascript
简单学习vue指令directive
Nov 03 #Javascript
Vue.js常用指令汇总(v-if、v-for等)
Nov 03 #Javascript
巧用Vue.js+Vuex制作专门收藏微信公众号的app
Nov 03 #Javascript
You might like
php根据身份证号码计算年龄的实例代码
2014/01/18 PHP
PHP连接Nginx服务器并解析Nginx日志的方法
2015/08/16 PHP
深入浅析PHP无限极分类的案例教程
2016/05/09 PHP
php项目中类的自动加载实例讲解
2019/09/12 PHP
PHP For循环字母A-Z当超过26个字母时输出AA,AB,AC
2020/02/16 PHP
Apache站点配置SSL强制跳转443
2021/03/09 Servers
修复IE9&amp;safari 的sort方法
2011/10/21 Javascript
JS隐藏参数post传值实例
2013/04/18 Javascript
jQuery+slidereveal实现的面板滑动侧边展出效果
2015/03/14 Javascript
微信小程序 删除项目工程实现步骤
2016/11/10 Javascript
利用JavaScript实现拖拽改变元素大小
2016/12/14 Javascript
Node.js+Express+MySql实现用户登录注册功能
2017/07/10 Javascript
深入讲解xhr(XMLHttpRequest)/jsonp请求之abort
2017/07/26 Javascript
如何将HTML字符转换为DOM节点并动态添加到文档中详解
2018/08/19 Javascript
express 项目分层实践详解
2018/12/10 Javascript
vue quill editor 使用富文本添加上传音频功能
2020/01/14 Javascript
Python  连接字符串(join %)
2008/09/06 Python
python的tkinter布局之简单的聊天窗口实现方法
2014/09/03 Python
Python多进程机制实例详解
2015/07/02 Python
Python开发微信公众平台的方法详解【基于weixin-knife】
2017/07/08 Python
python with提前退出遇到的坑与解决方案
2018/01/05 Python
Python 复平面绘图实例
2019/11/21 Python
国际商务系学生个人的自我评价
2013/11/26 职场文书
统计学专业毕业生的自我评价分享
2013/11/28 职场文书
保密工作实施方案
2014/02/24 职场文书
标准化管理实施方案
2014/02/25 职场文书
教育英语专业毕业生的求职信
2014/03/13 职场文书
教师新年寄语
2014/04/03 职场文书
诉讼代理人授权委托书
2014/04/08 职场文书
计算机相关专业自荐信
2014/07/02 职场文书
网吧消防安全责任书
2014/07/29 职场文书
旅行社优秀创业计划书
2014/08/16 职场文书
2014年办公室主任工作总结
2014/11/12 职场文书
公司员工奖惩制度
2015/08/04 职场文书
python字典的元素访问实例详解
2021/07/21 Python
让JavaScript代码更加精简的方法技巧
2022/06/01 Javascript