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 相关文章推荐
js getBoundingClientRect() 来获取页面元素的位置
Nov 25 Javascript
深入理解JavaScript系列(2) 揭秘命名函数表达式
Jan 15 Javascript
jQuery学习笔记之基础中的基础
Jan 19 Javascript
详解JavaScript中setSeconds()方法的使用
Jun 11 Javascript
浅谈javascript函数式编程
Sep 06 Javascript
Chrome不支持showModalDialog模态对话框和无法返回returnValue问题的解决方法
Oct 30 Javascript
JS 组件系列之Bootstrap Table的冻结列功能彻底解决高度问题
Jun 30 Javascript
JavaScript之class继承_动力节点Java学院整理
Jul 03 Javascript
最新Javascript程序员面试试题和解题方法
Nov 23 Javascript
element-ui上传一张图片后隐藏上传按钮功能
May 22 Javascript
vue实现将数据存入vuex中以及从vuex中取出数据
Nov 08 Javascript
js实现经典贪吃蛇小游戏
Mar 19 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
PHP个人网站架设连环讲(一)
2006/10/09 PHP
php csv操作类代码
2009/12/14 PHP
PHP简单实现数字分页功能示例
2016/08/24 PHP
PHP实现广度优先搜索算法(BFS,Broad First Search)详解
2017/09/16 PHP
js异或加解密效果代码
2008/06/25 Javascript
JavaScript下利用fso判断文件是否存在的代码
2010/12/11 Javascript
ie浏览器使用js导出网页到excel并打印
2014/03/11 Javascript
js实现仿百度汽车频道选择汽车图片展示实例
2015/05/06 Javascript
js判断radiobuttonlist的选中值显示/隐藏其它模块的实现方法
2016/08/25 Javascript
JavaScript 中对象的深拷贝
2016/12/04 Javascript
JavaScript简单计算人的年龄示例
2017/04/15 Javascript
H5图片压缩与上传实例
2017/04/21 Javascript
node跨域转发 express+http-proxy-middleware的使用
2018/05/31 Javascript
javascript for循环性能测试示例
2019/08/07 Javascript
jQuery实现简单飞机大战
2020/07/05 jQuery
vue-cli3自动消除console.log()的调试信息方式
2020/10/21 Javascript
在Python中使用M2Crypto模块实现AES加密的教程
2015/04/08 Python
Python实现打印螺旋矩阵功能的方法
2017/11/21 Python
Python tornado队列示例-一个并发web爬虫代码分享
2018/01/09 Python
详解Python3中ceil()函数用法
2019/02/19 Python
Python定时器线程池原理详解
2020/02/26 Python
Django models文件模型变更错误解决
2020/05/11 Python
详解pandas赋值失败问题解决
2020/11/29 Python
详解Python Celery和RabbitMQ实战教程
2021/01/20 Python
wordpress添加Html5的表单验证required方法小结
2020/08/18 HTML / CSS
英国健康和美容技术产品购物网站:CurrentBody
2019/07/17 全球购物
NICKIS.com荷兰:设计师儿童时装
2020/01/08 全球购物
是什么让J2EE适合用来开发多层的分布式的应用
2015/01/16 面试题
初中军训感想300字
2014/03/05 职场文书
竞选班长演讲稿400字
2014/08/22 职场文书
会计师事务所实习证明
2014/11/16 职场文书
2014年保育员工作总结
2014/12/02 职场文书
2015公务员试用期工作总结
2014/12/12 职场文书
听课评课活动心得体会
2016/01/15 职场文书
Vue中Object.assign清空数据报错的解决方案
2022/03/03 Vue.js
MSSQL基本语法操作
2022/04/11 SQL Server