jQuery each和js forEach用法比较


Posted in jQuery onFebruary 27, 2019

本文实例分析了jQuery each和js forEach用法。分享给大家供大家参考,具体如下:

对于遍历数组的元素,js和jquery都有类似的方法,js用的是forEach而jquery用的是each,简单举例;

var arr = new Array(["b", 2, "a", 4],["c",3,"d",6]);
arr.forEach(function(item){
  alert(item); //b, 2, a, 4和c,3,d,6
});

如果forEach里的回调函数只有一个参数则代表该集合里的元素;

var arr = new Array(["b", 2, "a", 4],["c",3,"d",6]);
arr.forEach(function(item, i){
  alert(item+"-"+i); //b, 2, a, 4-1和c,3,d,6-2;
  item.forEach(function(items, j){
    alert(items+"---------"+j); //b------0;2-------1;a----2;4------3;  c-----0;3-----1;d----2;6----3
  });
});

如果forEach里有两个参数,则第一个参数为该集合里的元素,第二个参数为集合的索引;

在jquery里则不同;

var arr = new Array(["b", 2, "a", 4],["c",3,"d",6]);
$.each(arr, function(item){
  alert(item); //0;1
});

如果回调函数里只有一个参数时,则为集合的索引;

var arr = new Array(["b", 2, "a", 4],["c",3,"d",6]);
$.each(arr, function(i, item){
  alert(item+"-"+i); //b, 2, a, 4-1和c,3,d,6-2;
  $.each(item, function(j, items){
    alert(items+"---------"+j); //b------0;2-------1;a----2;4------3;  c-----0;3-----1;d----2;6----3
  });
});

如果有两个参数,则第一个为索引,第二个该集合里的元素;

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

jQuery 相关文章推荐
如何将 jQuery 从你的 Bootstrap 项目中移除(取而代之使用Vue.js)
Jul 17 jQuery
基于jQuery中ajax的相关方法汇总(必看篇)
Nov 08 jQuery
(模仿京东用户注册)用JQuery实现简单表单验证,初学者必看
Jan 08 jQuery
bootstrap+jquery项目引入文件报错的解决方法
Jan 22 jQuery
jQuery代码优化方法总结
Jan 29 jQuery
jQuery中实现text()的方法
Apr 04 jQuery
Jquery让form表单异步提交代码实现
Nov 14 jQuery
jQuery 选择器用法基础入门示例
Jan 04 jQuery
jQuery实现简单聊天室
Feb 08 jQuery
jquery向后台提交数组的代码分析
Feb 20 jQuery
jQuery实现的上拉刷新功能组件示例
May 01 jQuery
Jquery如何使用animation动画效果改变背景色的代码
Jul 20 jQuery
jQuery中each和js中forEach的区别分析
Feb 27 #jQuery
原生JS forEach()和map()遍历的区别、兼容写法及jQuery $.each、$.map遍历操作
Feb 27 #jQuery
js/jquery遍历对象和数组的方法分析【forEach,map与each方法】
Feb 27 #jQuery
jQuery表单元素过滤选择器用法实例分析
Feb 20 #jQuery
jQuery内容过滤选择器与子元素过滤选择器用法实例分析
Feb 20 #jQuery
jQuery选择器之基本过滤选择器用法实例分析
Feb 19 #jQuery
jQuery选择器之层次选择器用法实例分析
Feb 19 #jQuery
You might like
PHILIPS AE3805收音机的分析打磨
2021/03/02 无线电
PHP 开发环境配置(Zend Server安装)
2010/04/28 PHP
PHP 命令行参数详解及应用
2011/05/18 PHP
部署PHP时的4个配置修改说明
2015/10/19 PHP
PHP Cookei记录用户历史浏览信息的代码
2016/02/03 PHP
jquery checkbox全选、取消全选实现代码
2010/03/05 Javascript
jQuery之$(document).ready()使用介绍
2012/04/05 Javascript
Jquery 选中表格一列并对表格排序实现原理
2012/12/15 Javascript
javascript自动改变文字大小和颜色的效果的小例子
2013/08/02 Javascript
动态加载jQuery的方法
2015/06/16 Javascript
javascript图片预加载完整实例
2015/12/10 Javascript
jQuery实现简易的输入框字数计数功能示例
2017/01/16 Javascript
AngularJS监听ng-repeat渲染完成的方法
2018/03/20 Javascript
JavaScript实现仿Clock ISO时钟
2018/06/29 Javascript
深入理解JavaScript 中的执行上下文和执行栈
2018/10/23 Javascript
浅谈webpack 四个核心概念之Entry
2019/06/12 Javascript
Python实现将绝对URL替换成相对URL的方法
2015/06/28 Python
python+os根据文件名自动生成文本
2019/03/21 Python
pyqt 实现为长内容添加滑轮 scrollArea
2019/06/19 Python
python-docx文件定位读取过程(尝试替换)
2020/02/13 Python
pyinstaller打包单文件时--uac-admin选项不起作用怎么办
2020/04/15 Python
Python Tkinter图形工具使用方法及实例解析
2020/06/15 Python
python获取百度热榜链接的实例方法
2020/08/25 Python
Python读取多列数据以及用matplotlib制作图表方法实例
2020/09/23 Python
python 还原梯度下降算法实现一维线性回归
2020/10/22 Python
阻止移动设备(手机、pad)浏览器双击放大网页的方法
2014/06/03 HTML / CSS
荷兰本土平价百货:HEMA
2017/10/23 全球购物
prAna官网:瑜伽、旅行和冒险服装
2019/03/10 全球购物
屈臣氏越南官网:Watsons越南
2021/01/14 全球购物
数据库什么时候应该被重组
2012/11/02 面试题
什么是岗位职责
2013/11/12 职场文书
客服主管岗位职责
2013/12/13 职场文书
八一慰问活动方案
2014/02/07 职场文书
行政部岗位职责范本
2014/03/13 职场文书
生产车间主任岗位职责
2015/04/08 职场文书
团结主题班会
2015/08/13 职场文书