$.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的智能提示插件一枚
Feb 18 Javascript
JavaScript 垃圾回收机制分析
Oct 10 Javascript
js实现正方形颜色从下往上升的效果
Aug 04 Javascript
JavaScript优化专题之Loading and Execution加载和运行
Jan 20 Javascript
浅谈函数调用的不同方式,以及this的指向
Sep 17 Javascript
浅谈Vue.nextTick 的实现方法
Oct 25 Javascript
cordova入门基础教程及使用中遇到的一些问题总结
Nov 14 Javascript
JavaScript设计模式之缓存代理模式原理与简单用法示例
Aug 07 Javascript
利用原生JavaScript实现造日历轮子实例代码
May 08 Javascript
小程序实现左滑删除效果
Jul 25 Javascript
创建nuxt.js项目流程图解
Mar 13 Javascript
用几道面试题来看JavaScript执行机制
Apr 30 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 中文处理函数集合
2008/08/27 PHP
腾讯QQ php程序员面试题目整理
2010/06/08 PHP
PHP实现登陆并抓取微信列表中最新一组微信消息的方法
2017/07/10 PHP
laravel-admin表单提交隐藏一些数据,回调时获取数据的方法
2019/10/08 PHP
PHP中用Trait封装单例模式的实现
2019/12/18 PHP
PHP利用缓存处理用户注册时的邮箱验证,成功后用户数据存入数据库操作示例
2019/12/31 PHP
解决extjs在firefox中关闭窗口再打开后iframe中js函数访问不到的问题
2008/11/06 Javascript
jQuery解决下拉框select设宽度时IE 6/7/8下option超出显示不全
2013/05/27 Javascript
JS正则表达式大全(整理详细且实用)
2013/11/14 Javascript
js 金额格式化来回转换示例
2014/02/23 Javascript
node.js中的fs.appendFile方法使用说明
2014/12/17 Javascript
JS实现消息来时让网页标题闪动效果的方法
2016/04/20 Javascript
jQuery获取table下某一行某一列的值实现代码
2017/04/07 jQuery
JS轮播图实现简单代码
2021/02/19 Javascript
BootStrap点击保存后实现模态框自动关闭的思路(模态框)
2017/09/26 Javascript
Vue2.0学习系列之项目上线的方法步骤(图文)
2018/09/25 Javascript
JS实现动态添加外部js、css到head标签的方法
2019/06/05 Javascript
微信小程序事件 bindtap bindinput代码实例
2019/08/26 Javascript
JQuery表单元素取值赋值方法总结
2020/05/12 jQuery
vue $router和$route的区别详解
2020/12/02 Vue.js
python发腾讯微博代码分享
2014/01/10 Python
Python计算两个日期相差天数的方法示例
2017/05/23 Python
tensorflow获取变量维度信息
2018/03/10 Python
Python import与from import使用及区别介绍
2018/09/06 Python
Python + selenium + requests实现12306全自动抢票及验证码破解加自动点击功能
2018/11/23 Python
python之mock模块基本使用方法详解
2019/06/27 Python
新手如何发布Python项目开源包过程详解
2019/07/11 Python
在pycharm中显示python画的图方法
2019/08/31 Python
SQL里面如何插入自动增长序列号字段
2012/03/29 面试题
用Python写一个for循环的例子
2016/07/19 面试题
医学生求职自荐信
2013/10/25 职场文书
公司财务工作总结的自我评价
2013/11/23 职场文书
小学校园之星事迹材料
2014/05/16 职场文书
2014年基层党支部工作总结
2014/12/04 职场文书
党员年度个人总结
2015/02/14 职场文书
2015公司年度工作总结
2015/05/14 职场文书