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 相关文章推荐
jQuery 表单验证插件formValidation实现个性化错误提示
Jun 23 Javascript
简略说明Javascript中的= =(等于)与= = =(全等于)区别
Apr 16 Javascript
jQuery中:last选择器用法实例
Dec 30 Javascript
Javascript实现鼠标右键特色菜单
Aug 04 Javascript
Bootstrap每天必学之折叠
Apr 12 Javascript
AngularJS指令详解及示例代码
Aug 16 Javascript
前端框架Vue.js构建大型应用浅析
Sep 12 Javascript
Vue+Flask实现简单的登录验证跳转的示例代码
Jan 13 Javascript
React如何解决fetch跨域请求时session失效问题
Nov 02 Javascript
基于纯JS实现多张图片的懒加载Lazy过程解析
Oct 14 Javascript
Vue.js watch监视属性知识点总结
Nov 11 Javascript
js布局实现单选按钮控件
Jan 17 Javascript
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
暴雪前总裁遗憾:没尽早追赶Dota 取消星际争霸幽灵
2020/03/08 星际争霸
PHP实现实时生成并下载超大数据量的EXCEL文件详解
2017/10/23 PHP
实例讲解PHP页面静态化
2018/02/05 PHP
javascript indexOf函数使用说明
2008/07/03 Javascript
javascript不同页面传值的改进版
2008/09/30 Javascript
基于JQuery的密码强度验证代码
2010/03/01 Javascript
jQuery 打造动态下滑菜单实现说明
2010/04/15 Javascript
非常棒的10款jQuery 幻灯片插件
2011/06/14 Javascript
基于jQuery的投票系统显示结果插件
2011/08/12 Javascript
jquery实现按Enter键触发事件示例
2013/09/10 Javascript
javascript 数组排序函数sort和reverse使用介绍
2013/11/21 Javascript
JavaScript window.location对象
2014/11/14 Javascript
Javascript中的call()方法介绍
2015/03/15 Javascript
jquery实现点击展开列表同时隐藏其他列表
2015/08/10 Javascript
JavaScript中自带的 reduce()方法使用示例详解
2016/08/10 Javascript
微信小程序 两种为对象属性赋值的方式详解
2017/02/23 Javascript
JavaScript函数式编程(Functional Programming)纯函数用法分析
2019/05/22 Javascript
JS document对象简单用法完整示例
2020/01/14 Javascript
浅析JavaScript预编译和暗示全局变量
2020/09/03 Javascript
从零学Python之入门(五)缩进和选择
2014/05/27 Python
Python实现重建二叉树的三种方法详解
2018/06/23 Python
django 微信网页授权认证api的步骤详解
2019/07/30 Python
ipad上运行python的方法步骤
2019/10/12 Python
使用python 计算百分位数实现数据分箱代码
2020/03/03 Python
浅谈keras中loss与val_loss的关系
2020/06/22 Python
matplotlib 画双轴子图无法显示x轴的解决方法
2020/07/27 Python
python 判断一组数据是否符合正态分布
2020/09/23 Python
Python爬虫之Selenium下拉框处理的实现
2020/12/04 Python
电影T恤、80年代T恤和80年代服装:TV Store Online
2020/01/05 全球购物
环境工程大学生自荐信
2013/10/21 职场文书
九年级英语教学反思
2014/01/31 职场文书
安全教育月活动总结
2014/05/05 职场文书
人事局接收函
2015/01/30 职场文书
音乐研修感悟
2015/11/18 职场文书
电力安全学习心得体会
2016/01/18 职场文书
浅谈CSS不规则边框的生成方案
2021/05/25 HTML / CSS