$.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下有关dom以及xml节点访问兼容问题
Nov 26 Javascript
javascript中的继承实例代码
Apr 27 Javascript
Javascript 倒计时源代码.(时.分.秒) 详细注释版
May 09 Javascript
js实现动态改变字体大小代码
Jan 02 Javascript
JavaScript将一个数组插入到另一个数组的方法
Mar 19 Javascript
jquery validate和jquery form 插件组合实现验证表单后AJAX提交
Aug 26 Javascript
js中编码函数:escape,encodeURI与encodeURIComponent详解
Mar 21 Javascript
详解Vue 非父子组件通信方法(非Vuex)
May 24 Javascript
vue做移动端适配最佳解决方案(亲测有效)
Sep 04 Javascript
JS+php后台实现文件上传功能详解
Mar 02 Javascript
使用vue-router在Vue页面之间传递数据的方法
Jul 15 Javascript
vue实现div可拖动位置也可改变盒子大小的原理
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
基于PHP5魔术常量与魔术方法的详解
2013/06/13 PHP
php获取错误信息的方法
2015/07/17 PHP
PHP对称加密算法(DES/AES)类的实现代码
2017/11/14 PHP
Laravel框架搜索分页功能示例
2019/02/01 PHP
PHP CURL中传递cookie的方法步骤
2019/05/09 PHP
关于JS管理作用域的问题
2013/04/10 Javascript
JavaScript获取和设置CheckBox状态的简单方法
2013/07/05 Javascript
jquery利用ajax调用后台方法实例
2013/08/23 Javascript
Javascript学习笔记之 对象篇(一) : 对象的使用和属性
2014/06/24 Javascript
深入浅析javascript立即执行函数
2015/10/23 Javascript
jqGrid用法汇总(全经典)
2016/06/28 Javascript
Bootstrap选项卡动态切换效果
2016/11/28 Javascript
利用JQuery实现datatables插件的增加和删除行功能
2017/01/06 Javascript
javascript简单写的判断电话号码实例
2017/05/24 Javascript
React 项目迁移 Webpack Babel7的实现
2018/09/12 Javascript
前端面试知识点目录一览
2019/04/15 Javascript
微信小程序sessionid不一致问题解决
2019/08/30 Javascript
vue实现移动端图片上传功能
2019/12/23 Javascript
JS如何实现网站中PC端和手机端自动识别并跳转对应的代码
2020/01/08 Javascript
vue elementui 实现搜索栏公共组件封装的实例代码
2020/01/20 Javascript
Python将图片批量从png格式转换至WebP格式
2020/08/22 Python
Python机器学习之决策树算法实例详解
2017/12/06 Python
Centos7 Python3下安装scrapy的详细步骤
2018/03/15 Python
python微信公众号之关键词自动回复
2018/06/15 Python
基于PyQt4和PySide实现输入对话框效果
2019/02/27 Python
谈谈python垃圾回收机制
2020/09/27 Python
pandas针对excel处理的实现
2021/01/15 Python
HTML5 canvas基本绘图之绘制线段
2016/06/27 HTML / CSS
使用HTML5 Geolocation实现一个距离追踪器
2018/04/09 HTML / CSS
美国用餐电影院:Alamo Drafthouse Cinema
2020/01/23 全球购物
职专应届生求职信
2013/11/16 职场文书
病媒生物防治方案
2014/05/13 职场文书
2015年组织委员工作总结
2015/04/23 职场文书
本科毕业论文致谢怎么写
2015/05/14 职场文书
Python中的tkinter库简单案例详解
2022/01/22 Python
nginx容器方式反向代理实战
2022/04/18 Servers