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方法和技巧大全
Dec 27 Javascript
javascript基础的动画教程,直观易懂
Jan 10 Javascript
自适应高度框架 ----属个人收藏内容
Jan 22 Javascript
jQuery+ajax实现动态执行脚本的方法
Jan 27 Javascript
深入理解jquery中的事件与动画
May 24 Javascript
jQuery简单实现上下,左右滑动的方法
Jun 01 Javascript
JS获取及验证开始结束日期的方法
Aug 20 Javascript
js文件中直接alert()中文出来的是乱码的解决方法
Nov 01 Javascript
深入浅析Vue.js中 computed和methods不同机制
Mar 22 Javascript
详解vue axios二次封装
Jul 22 Javascript
vue.js高德地图实现热点图代码实例
Apr 18 Javascript
Antd中单个DatePicker限定时间输入范围操作
Oct 29 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生成带有雪花背景的验证码
2006/10/09 PHP
thinkphp 一个页面使用2次分页的实现方法
2013/07/15 PHP
Symfony的安装和配置方法
2016/03/17 PHP
AJAX使用了UpdatePanel后无法使用alert弹出脚本
2010/04/02 Javascript
JavaScript 面向对象之命名空间
2010/05/04 Javascript
js弹出的对话窗口永远保持居中显示
2012/12/15 Javascript
原生javascript兼容性测试实例
2013/07/01 Javascript
js中arguments,caller,callee,apply的用法小结
2014/01/28 Javascript
js限制文本框只能输入整数或者带小数点的数字
2015/04/27 Javascript
浅谈JavaScript 的执行顺序
2015/08/07 Javascript
js右下角弹出提示框示例代码
2016/01/12 Javascript
JS针对浏览器窗口关闭事件的监听方法集锦
2016/06/24 Javascript
页面间固定参数,通过cookie传值的实现方法
2017/05/31 Javascript
webpack进阶——缓存与独立打包的用法
2017/08/02 Javascript
javascript代码优化的8点总结
2018/01/29 Javascript
Vue.js样式动态绑定实现小结
2019/01/24 Javascript
浅谈js闭包理解
2019/04/01 Javascript
详解关于React-Router4.0跳转不置顶解决方案
2019/05/10 Javascript
Node使用Selenium进行前端自动化操作的代码实现
2019/10/10 Javascript
vue 二维码长按保存和复制内容操作
2020/09/22 Javascript
[01:02:07]Liquid vs Newbee 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/16 DOTA
python3.6中anaconda安装sklearn踩坑实录
2020/07/28 Python
如何用Java实现列出某个目录下的所有子目录
2015/07/20 面试题
化工专业个人的求职信范文
2013/11/28 职场文书
体育教师自荐信范文
2013/12/16 职场文书
校园招聘策划书
2014/01/09 职场文书
食堂采购员岗位职责
2014/03/17 职场文书
远程网络教育毕业生自我鉴定
2014/04/14 职场文书
求职信怎么写
2014/05/23 职场文书
李敖北大演讲稿
2014/05/24 职场文书
学习优秀党务工作者先进事迹材料思想报告
2014/09/17 职场文书
2016年教师师德师风心得体会
2016/01/12 职场文书
Mysql 用户权限管理实现
2021/05/25 MySQL
Win11 Build 22000.51版本文件资源管理器“命令栏”和上下文菜单有什么新变化?
2021/11/21 数码科技
Win11怎么跳过联网验机 ?Win11跳过联网验机激活教程
2022/04/05 数码科技
Spring Data JPA框架Repository自定义实现
2022/04/28 Java/Android