jQuery $.each遍历对象、数组用法实例


Posted in Javascript onApril 16, 2015

通过它,你可以遍历对象、数组的属性值并进行处理。

使用说明

each函数根据参数的类型实现的效果不完全一致:

1、遍历对象(有附加参数)

$.each(Object, function(p1, p2) {
     this;       //这里的this指向每次遍历中Object的当前属性值

     p1; p2;     //访问附加参数
}, ['参数1', '参数2']);

 

2、遍历数组(有附件参数)

$.each(Array, function(p1, p2){
     this;       //这里的this指向每次遍历中Array的当前元素

     p1; p2;     //访问附加参数

}, ['参数1', '参数2']);

 

3、遍历对象(没有附加参数)

$.each(Object, function(name, value) {
     this;      //this指向当前属性的值

     name;      //name表示Object当前属性的名称

     value;     //value表示Object当前属性的值

});

[code]

 
4、遍历数组(没有附加参数)
[code]

$.each(Array, function(i, value) {
     this;      //this指向当前元素

     i;         //i表示Array当前下标

     value;     //value表示Array当前元素
});

下面提一下jQuery的each方法的几种常用的用法
 var arr = [ "one", "two", "three", "four"];     

 $.each(arr, function(){     

    alert(this);     

 });     

//上面这个each输出的结果分别为:one,two,three,four    

    

var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]     

$.each(arr1, function(i, item){     

   alert(item[0]);     

});     

//其实arr1为一个二维数组,item相当于取每一个一维数组,   

//item[0]相对于取每一个一维数组里的第一个值   

//所以上面这个each输出分别为:1   4   7     

  

  

var obj = { one:1, two:2, three:3, four:4};     

$.each(obj, function(key, val) {     

    alert(obj[key]);           

});   

//这个each就有更厉害了,能循环每一个属性     

//输出结果为:1   2  3  4
Javascript 相关文章推荐
Discuz! 6.1_jQuery兼容问题
Sep 23 Javascript
Javascript中的String对象详谈
Mar 03 Javascript
javascript中mouseover、mouseout使用详解
Jul 19 Javascript
JSON遍历方式实例总结
Dec 07 Javascript
Bootstrap学习笔记之css样式设计(1)
Jun 07 Javascript
值得分享的bootstrap table实例
Sep 22 Javascript
angularjs之$timeout指令详解
Jun 13 Javascript
深入理解Vue 单向数据流的原理
Nov 09 Javascript
Vue 数据绑定的原理分析
Nov 16 Javascript
JS中多层次排序算法的实现代码
Jan 06 Javascript
如何使用JavaScript策略模式校验表单
Apr 29 Javascript
Vue3中toRef与toRefs的区别
Mar 24 Vue.js
jQuery Ajax中的事件详细介绍
Apr 16 #Javascript
JavaScript实现页面5秒后自动跳转的方法
Apr 16 #Javascript
JavaScript实现随机替换图片的方法
Apr 16 #Javascript
jQuery实现在下拉列表选择时获取json数据的方法
Apr 16 #Javascript
jQuery控制元素显示、隐藏、切换、滑动的方法总结
Apr 16 #Javascript
jquery插件bxslider用法实例分析
Apr 16 #Javascript
JQuery显示、隐藏div的几种方法简明总结
Apr 16 #Javascript
You might like
Ajax实时验证用户名/邮箱等是否已经存在的代码打包
2011/12/01 PHP
PHP和Shell实现检查SAMBA与NFS Server是否存在
2015/01/07 PHP
TP(thinkPHP)框架多层控制器和多级控制器的使用示例
2018/06/13 PHP
深入认识javascript中的eval函数
2009/11/02 Javascript
Ext修改GridPanel数据和字体颜色、css属性等
2014/06/13 Javascript
Ionic学习日记实现验证码倒计时
2018/02/08 Javascript
webpack之devtool详解
2018/02/10 Javascript
nodejs通过钉钉群机器人推送消息的实现代码
2019/05/05 NodeJs
微信小程序实现批量倒计时功能
2020/11/01 Javascript
webpack 如何解析代码模块路径的实现
2019/09/04 Javascript
javascript实现异形滚动轮播
2019/11/28 Javascript
python服务器端收发请求的实现代码
2014/09/29 Python
Python爬虫包BeautifulSoup实例(三)
2018/06/17 Python
python查看列的唯一值方法
2018/07/17 Python
numpy添加新的维度:newaxis的方法
2018/08/02 Python
Python3.5装饰器原理及应用实例详解
2019/04/30 Python
浅谈Python编程中3个常用的数据结构和算法
2019/04/30 Python
Python3 执行系统命令并获取实时回显功能
2019/07/09 Python
python使用tomorrow实现多线程的例子
2019/07/20 Python
基于打开pycharm有带图片md文件卡死问题的解决
2020/04/24 Python
利用Python pandas对Excel进行合并的方法示例
2020/11/04 Python
马来西亚综合购物网站:Lazada马来西亚
2018/06/05 全球购物
会计专业自荐信
2013/12/02 职场文书
业务部门经理岗位职责
2014/02/23 职场文书
小学模范班主任事迹材料
2014/05/13 职场文书
学校春季防火方案
2014/06/08 职场文书
大学生找工作求职信
2014/07/09 职场文书
项目委托协议书(最新)
2014/09/13 职场文书
2015年农村党员公开承诺事项
2015/04/28 职场文书
反腐倡廉影片观后感
2015/06/08 职场文书
行政处罚听证告知书
2015/07/01 职场文书
计算机实训心得体会
2016/01/14 职场文书
详解MySQL的主键查询为什么这么快
2022/04/03 MySQL
SQL Server使用导出向导功能
2022/04/08 SQL Server
vue特效之翻牌动画
2022/04/20 Vue.js
MySQL下载安装配置详细教程 附下载资源
2022/09/23 MySQL