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 相关文章推荐
JavaScript与函数式编程解释
Apr 27 Javascript
autoPlay 基于jquery的图片自动播放效果
Dec 07 Javascript
常见JS效果之图片减速度滚动实现代码
Dec 08 Javascript
Javascript this 关键字 详解
Oct 22 Javascript
JS打开新窗口防止被浏览器阻止的方法
Jan 03 Javascript
JavaScript去除数组里重复值的方法
Jul 13 Javascript
jquery实现实时改变网页字体大小、字体背景色和颜色的方法
Aug 05 Javascript
Bootstrap文件上传组件之bootstrap fileinput
Nov 25 Javascript
angularJS利用ng-repeat遍历二维数组的实例代码
Jun 03 Javascript
使用vue中的混入mixin优化表单验证插件问题
Jul 02 Javascript
浅谈laytpl 模板空值显示null的解决方法及简单的js表达式
Sep 19 Javascript
如何在vue 中引入使用jquery
Nov 10 jQuery
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
php 防止单引号,双引号在接受页面转义
2008/07/10 PHP
PHP中加密解密函数与DES加密解密实例
2014/10/17 PHP
php替换字符串中间字符为省略号的方法
2015/05/04 PHP
PHP身份证校验码计算方法
2016/08/10 PHP
JavaScript学习点滴 call、apply的区别
2010/10/22 Javascript
jQuery Mobile页面跳转后未加载外部JS原因分析及解决
2013/03/18 Javascript
为指定的元素添加遮罩层的示例代码
2014/01/15 Javascript
jquery修改网页背景颜色通过css方法实现
2014/06/06 Javascript
java、javascript实现附件下载示例
2014/08/14 Javascript
JavaScript生成随机字符串的方法
2015/03/19 Javascript
原创jQuery弹出层插件分享
2015/04/02 Javascript
JQuery实现的图文自动轮播效果插件
2015/06/19 Javascript
jQuery实现点击按钮弹出可关闭层的浮动层插件
2015/09/19 Javascript
Node.js与Sails ~项目结构与Mvc实现及日志机制
2015/10/14 Javascript
js 两个日期比较相差多少天的实例
2017/10/19 Javascript
React-native桥接Android原生开发详解
2018/01/17 Javascript
在小程序Canvas中使用measureText的方法示例
2018/10/19 Javascript
微信小程序实现动态显示和隐藏某个控件功能示例
2018/12/14 Javascript
vue计算属性computed的使用方法示例
2019/03/13 Javascript
JS立即执行的匿名函数用法分析
2019/11/04 Javascript
Kettle中使用JavaScrip调用jar包对文件内容进行MD5加密的操作方法
2020/09/04 Javascript
javascript自定义加载loading效果
2020/09/15 Javascript
[57:41]Secret vs Serenity 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
python处理csv数据的方法
2015/03/11 Python
Python 多线程实例详解
2017/03/25 Python
Python判断文件和字符串编码类型的实例
2017/12/21 Python
python让列表倒序输出的实例
2018/06/25 Python
学生信息管理系统Python面向对象版
2019/01/30 Python
中层干部岗位职责
2013/12/18 职场文书
我们的节日清明节活动方案
2014/03/05 职场文书
机械专业应届毕业生自荐书
2014/06/12 职场文书
中央空调节能方案
2014/06/15 职场文书
四风问题个人对照检查材料
2014/09/26 职场文书
新教师教学工作总结
2015/08/14 职场文书
预备党员表决心的话
2015/09/22 职场文书
2016党员党课心得体会
2016/01/07 职场文书