$.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 相关文章推荐
JavaScript中使用stopPropagation函数停止事件传播例子
Aug 27 Javascript
javascript实现简单的省市区三级联动
May 14 Javascript
简单实现js选项卡切换效果
Feb 03 Javascript
谷歌showModalDialog()方法不兼容出现对话窗口的解决办法
Feb 15 Javascript
ReactNative页面跳转实例代码
Sep 27 Javascript
JS基于递归实现倒计时效果的方法
Nov 26 Javascript
Bootstrap Tree View简单而优雅的树结构组件实例解析
Jun 15 Javascript
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 jQuery
使用vuex的state状态对象的5种方式
Apr 19 Javascript
vue cli安装使用less的教程详解
Jul 12 Javascript
Vue数字输入框组件使用方法详解
Feb 10 Javascript
VueQuillEditor富文本上传图片(非base64)
Jun 03 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
php代码架构的八点注意事项
2016/01/25 PHP
PHP读MYSQL中文乱码的快速解决方法
2016/10/01 PHP
PDO::rollBack讲解
2019/01/29 PHP
Jquery实现无刷新DropDownList联动实现代码
2010/03/08 Javascript
加随机数引入脚本不让浏览器读取缓存
2014/09/04 Javascript
jQuery中map()方法用法实例
2015/01/06 Javascript
AngularJS学习笔记之TodoMVC的分析
2015/02/22 Javascript
javascript中in运算符用法分析
2015/04/28 Javascript
JavaScript学习笔记(三):JavaScript也有入口Main函数
2015/09/12 Javascript
JS实现仿雅虎首页快捷登录入口及导航模块效果
2015/09/19 Javascript
jQuery筛选数组之grep、each、inArray、map的用法及遍历json对象
2016/06/20 Javascript
JS与HTML结合使用marquee标签实现无缝滚动效果代码
2016/07/05 Javascript
Angular2  NgModule 模块详解
2016/10/19 Javascript
使用yeoman构建angular应用的方法
2017/08/14 Javascript
微信小程序picker组件下拉框选择input输入框的实例
2017/09/20 Javascript
nodejs+mongodb+vue前后台配置ueditor的示例代码
2018/01/02 NodeJs
用POSTMAN发送JSON格式的POST请求示例
2018/09/04 Javascript
创建echart多个联动的示例代码
2018/11/23 Javascript
JS前端知识点总结之页面加载事件,数组操作,DOM节点操作,循环和分支
2019/07/04 Javascript
vue将data恢复到初始状态 && 重新渲染组件实例
2020/09/04 Javascript
python中通过预先编译正则表达式提高效率
2017/09/25 Python
详解python字节码
2018/02/07 Python
对Python的多进程锁的使用方法详解
2019/02/18 Python
python笔记_将循环内容在一行输出的方法
2019/08/08 Python
使用python turtle画高达
2020/01/19 Python
python数据库操作mysql:pymysql、sqlalchemy常见用法详解
2020/03/30 Python
Python3实现英文字母转换哥特式字体实例代码
2020/09/01 Python
aec加密 php_php aes加密解密类(兼容php5、php7)
2021/03/14 PHP
Osklen官方在线商店:巴西服装品牌
2019/04/25 全球购物
乔布斯斯坦福大学演讲稿
2014/05/23 职场文书
致百米运动员广播稿5篇
2014/10/13 职场文书
三年级学生期末评语
2014/12/26 职场文书
2015小学教师年度工作总结
2015/05/12 职场文书
廉洁自律证明
2015/06/24 职场文书
利用Nginx代理如何解决前端跨域问题详析
2021/04/02 Servers
python如何将mat文件转为png
2022/07/15 Python