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+css实现侧边导航栏效果
Jun 12 jQuery
基于jQuery封装的分页组件
Jun 26 jQuery
jquery实现限制textarea输入字数的方法
Sep 06 jQuery
关于jQuery里prev()的简单操作代码
Oct 27 jQuery
jQuery实现下拉菜单动态添加数据点击滑出收起其他功能
Jun 14 jQuery
jquery.pagination.js分页使用教程
Oct 23 jQuery
jQuery控制input只能输入数字和两位小数的方法
May 16 jQuery
jQuery实现input输入框获取焦点与失去焦点时提示的消失与显示功能示例
May 27 jQuery
JQuery插件tablesorter表格排序实现过程解析
May 28 jQuery
基于JavaScript或jQuery实现网站夜间/高亮模式
May 30 jQuery
jQuery 添加元素和删除元素的方法
Jul 15 jQuery
jquery实现抽奖功能
Oct 22 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
虫族 Zerg 热键控制
2020/03/14 星际争霸
PHP基于单例模式实现的mysql类
2016/01/09 PHP
PHP实现图片压缩
2020/09/09 PHP
JavaScript入门教程(9) Document文档对象
2009/01/31 Javascript
JavaScript 应用技巧集合[推荐]
2009/08/30 Javascript
Yii-自定义删除确认弹框(zyd)jquery实现代码
2013/03/04 Javascript
jquery prop的使用介绍及与attr的区别
2013/12/19 Javascript
javascript常用的方法分享
2015/07/01 Javascript
js获取url传值的方法
2015/12/18 Javascript
微信小程序自动客服功能
2017/11/02 Javascript
vue项目每30秒刷新1次接口的实现方法
2018/12/04 Javascript
vue 导航锚点_点击平滑滚动,导航栏对应变化详解
2020/08/10 Javascript
vue修改Element的el-table样式的4种方法
2020/09/17 Javascript
[04:29]2016国际邀请赛中国区预选赛Ehome战队教练采访
2016/06/27 DOTA
Pthon批量处理将pdb文件生成dssp文件
2015/06/21 Python
如何将python中的List转化成dictionary
2016/08/15 Python
python 线程的暂停, 恢复, 退出详解及实例
2016/12/06 Python
python机器学习之神经网络(二)
2017/12/20 Python
Python实现判断并移除列表指定位置元素的方法
2018/04/13 Python
python实现京东秒杀功能
2018/07/30 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
matplotlib教程——强大的python作图工具库
2020/10/15 Python
Python的轻量级ORM框架peewee使用教程
2021/02/05 Python
Django如何重置migration的几种情景
2021/02/24 Python
css3.0新属性效果在ie下的解决方案
2010/05/10 HTML / CSS
世界上最好的精品店:Shoptiques
2018/02/05 全球购物
一组SQL面试题
2016/02/15 面试题
会计应聘求职信范文
2013/12/17 职场文书
《猴子种树》教学反思
2014/02/14 职场文书
主题班会演讲稿
2014/05/22 职场文书
2014年高校辅导员工作总结
2014/12/09 职场文书
责任书格式
2015/01/29 职场文书
Python利用capstone实现反汇编
2022/04/06 Python
PostgreSQL 插入INSERT、删除DELETE、更新UPDATE、事务transaction
2022/04/12 PostgreSQL
Java工作中实用的代码优化技巧分享
2022/04/21 Java/Android
python pandas 解析(读取、写入)CSV 文件的操作方法
2022/12/24 Python