$.each遍历对象、数组的属性值并进行处理


Posted in Javascript onJuly 18, 2014

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

使用说明

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当前属性的值
});

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

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

下面提一下jQuery的each方法的几种常用的用法

Js代码

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 相关文章推荐
jquery+json 通用三级联动下拉列表
Apr 19 Javascript
扩展easyui.datagrid,添加数据loading遮罩效果代码
Nov 02 Javascript
node.js适合游戏后台开发吗?
Sep 03 Javascript
js图片模糊切换显示特效的方法
Feb 17 Javascript
js简单判断移动端系统的方法
Feb 25 Javascript
jQuery插件ImageDrawer.js实现动态绘制图片动画(附源码下载)
Feb 25 Javascript
开启BootStrap学习之旅
May 04 Javascript
jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码
Dec 27 Javascript
vue项目部署到Apache服务器中遇到的问题解决
Aug 24 Javascript
新手必须知的Node.js 4个JavaScript基本概念
Sep 16 Javascript
webpack4之如何编写loader的方法步骤
Jun 06 Javascript
layer弹出层自适应高度,垂直水平居中的实现
Sep 16 Javascript
js 模式窗口(模式对话框和非模式对话框)的使用介绍
Jul 17 #Javascript
一个小例子解释如何来阻止Jquery事件冒泡
Jul 17 #Javascript
iframe调用父页面函数示例详解
Jul 17 #Javascript
js中一维数组和二位数组中的几个问题示例说明
Jul 17 #Javascript
js中函数调用的两种常用方法使用介绍
Jul 17 #Javascript
jQuery中关于ScrollableGridPlugin.js(固定表头)插件的使用逐步解析
Jul 17 #Javascript
Express.JS使用详解
Jul 17 #Javascript
You might like
ThinkPHP的RBAC(基于角色权限控制)深入解析
2013/06/17 PHP
php实现仿写CodeIgniter的购物车类
2015/07/29 PHP
PHP连接及操作PostgreSQL数据库的方法详解
2019/01/30 PHP
海量经典的jQuery插件集合
2010/01/12 Javascript
比较搞笑的js陷阱题
2010/02/07 Javascript
DWR实现模拟Google搜索效果实现原理及代码
2013/01/30 Javascript
jquery 提示信息显示后自动消失的具体实现
2013/12/18 Javascript
sliderToggle在写jquery的计时器setTimeouter中不生效
2014/05/26 Javascript
Node调试工具JSHint的安装及配置教程
2014/05/27 Javascript
nodejs中使用monk访问mongodb
2014/07/06 NodeJs
原生js实现移动开发轮播图、相册滑动特效
2015/04/17 Javascript
JavaScript代码性能优化总结(推荐)
2016/05/16 Javascript
原生js实现中奖信息无间隙滚动效果
2017/01/18 Javascript
Bootstrap table简单使用总结
2017/02/15 Javascript
IE11下使用canvas.toDataURL报SecurityError错误的解决方法
2017/11/19 Javascript
使用vue-router为每个路由配置各自的title
2018/07/30 Javascript
vue异步axios获取的数据渲染到页面的方法
2018/08/09 Javascript
原生JS实现的自动轮播图功能详解
2018/12/28 Javascript
使用nodejs分离html文件里的js和css详解
2019/04/12 NodeJs
js module大战
2019/04/19 Javascript
JS字符串与二进制的相互转化实例代码详解
2019/06/28 Javascript
nodejs环境使用Typeorm连接查询Oracle数据
2019/12/05 NodeJs
[10:05]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD 选手采访
2021/03/11 DOTA
在Python中定义和使用抽象类的方法
2016/06/30 Python
Python中的random.uniform()函数教程与实例解析
2019/03/02 Python
Python如何实现小程序 无限求和平均
2020/02/18 Python
有趣的Python图片制作之如何用QQ好友头像拼接出里昂
2020/04/22 Python
电钳专业个人求职信
2014/01/04 职场文书
护士毕业实习感言
2014/03/05 职场文书
小学师德标兵先进事迹材料
2014/05/25 职场文书
体育专业大学生职业生涯规划范文:打造自己的运动帝国
2014/09/12 职场文书
2014教师个人自我评价范文
2014/09/13 职场文书
小学数学继续教育研修日志
2015/11/13 职场文书
2016秋季校长开学典礼致辞
2015/11/26 职场文书
Vue如何清空对象
2022/03/03 Vue.js
navicat 连接Ubuntu虚拟机的mysql的操作方法
2022/04/02 MySQL