jQuery中$.each使用详解


Posted in Javascript onJanuary 29, 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当前属性的值
});

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

本文就先到这里了,简单描述下jQuery中。$.each的使用方法,希望小伙伴们能够喜欢。

Javascript 相关文章推荐
JSON扫盲帖 JSON.as类教程
Feb 16 Javascript
JS按位非(~)运算符与~~运算符的理解分析
Jul 31 Javascript
JS防止用户多次提交的简单代码
Aug 01 Javascript
复选框全选与全不选操作实现思路
Aug 18 Javascript
跨域传值即主页面与iframe之间互相传值
Dec 09 Javascript
js防止页面被iframe调用的方法
Oct 30 Javascript
JavaScript 开发工具webstrom使用指南
Dec 09 Javascript
详解用函数式编程对JavaScript进行断舍离
Sep 18 Javascript
微信小程序数据存储与取值详解
Jan 30 Javascript
JS中利用FileReader实现上传图片前本地预览功能
Mar 02 Javascript
koa socket即时通讯的示例代码
Sep 07 Javascript
微信小程序实现树莓派(raspberry pi)小车控制
Feb 12 Javascript
jQuery显示和隐藏 常用的状态判断方法
Jan 29 #Javascript
移动设备web开发首选框架:zeptojs介绍
Jan 29 #Javascript
JSON格式的键盘编码对照表
Jan 29 #Javascript
js的window.showModalDialog及window.open用法实例分析
Jan 29 #Javascript
JQuery异步获取返回值中文乱码的解决方法
Jan 29 #Javascript
AngularJS中的模块详解
Jan 29 #Javascript
jquery结合CSS使用validate实现漂亮的验证
Jan 29 #Javascript
You might like
PHP fastcgi模式上传大文件(大约有300多K)报错
2014/09/28 PHP
PHP遍历数组的方法汇总
2015/04/30 PHP
PHP6新特性分析
2016/03/03 PHP
PHP 匿名函数与注意事项详细介绍
2016/11/26 PHP
jQuery实现鼠标可拖动调整表格列宽度
2014/05/26 Javascript
jQuery实现视频作为全屏幕背景
2014/12/18 Javascript
jquery动态增加删减表格行特效
2015/11/20 Javascript
基于js实现微信发送好友如何分享到朋友圈、微博
2015/11/30 Javascript
jquery获取所有选中的checkbox实现代码
2016/05/26 Javascript
D3.js实现折线图的方法详解
2016/09/21 Javascript
Vue.js实现移动端短信验证码功能
2017/03/29 Javascript
基于JSON数据格式详解
2017/08/31 Javascript
node+express+ejs使用模版引擎做的一个示例demo
2017/09/18 Javascript
微信小程序自定义底部弹出框
2020/11/16 Javascript
echarts实现词云自定义形状的示例代码
2019/02/20 Javascript
详解使用uni-app开发微信小程序之登录模块
2019/05/09 Javascript
javascript实现5秒倒计时并跳转功能
2019/06/20 Javascript
ES6模板字符串和标签模板的应用实例分析
2019/06/25 Javascript
JavaScript实现的联动菜单特效示例
2019/07/08 Javascript
实例介绍Python中整型
2019/02/11 Python
Django框架登录加上验证码校验实现验证功能示例
2019/05/23 Python
Python Django view 两种return的实现方式
2020/03/16 Python
tensorflow基于CNN实战mnist手写识别(小白必看)
2020/07/20 Python
使用HTML5 Canvas API绘制弧线的教程
2016/03/22 HTML / CSS
美国领先的医疗警报服务:Philips Lifeline
2018/03/12 全球购物
市场部管理制度
2014/02/02 职场文书
政府法律服务方案
2014/06/14 职场文书
2014年大学生党员自我评议
2014/09/22 职场文书
县委班子四风对照检查材料思想汇报
2014/09/29 职场文书
庆祝教师节标语
2014/10/09 职场文书
2014年组织委员工作总结
2014/12/01 职场文书
自荐信怎么写
2015/03/04 职场文书
军事博物馆观后感
2015/06/05 职场文书
2019同学聚会主持词
2019/05/06 职场文书
分析mysql中一条SQL查询语句是如何执行的
2021/06/21 MySQL
MySql统计函数COUNT的具体使用详解
2022/08/14 MySQL