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 相关文章推荐
prototype 学习笔记整理
Jul 17 Javascript
JQuery操作iframe父页面与子页面的元素与方法(实例讲解)
Nov 20 Javascript
javascript实现百度地图鼠标滑动事件显示、隐藏
Apr 02 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
Jun 22 Javascript
js实现textarea限制输入字数
Feb 13 Javascript
详解Vue.js 2.0 如何使用axios
Apr 21 Javascript
JavaScript重复元素处理方法分析【统计个数、计算、去重复等】
Dec 14 Javascript
简单谈谈CommonsChunkPlugin抽取公共模块
Dec 31 Javascript
jQuery中ajax获取数据赋值给页面的实例
Dec 31 jQuery
让你5分钟掌握9个JavaScript小技巧
Jun 09 Javascript
使用vue打包时vendor文件过大或者是app.js文件很大的问题
Jun 29 Javascript
vue 优化CDN加速的方法示例
Sep 19 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编写学校网站上新生注册登陆程序的实例分享
2016/03/21 PHP
php  PATH_SEPARATOR判断当前服务器系统类型实例
2016/10/28 PHP
php+ajax+json 详解及实例代码
2016/12/12 PHP
使用PHPStorm+XDebug搭建单步调试环境
2017/11/19 PHP
关于Anemometer图形化显示MySQL慢日志的工具搭建及使用的详细介绍
2020/07/13 PHP
JavaScript 撑出页面文字换行
2009/06/15 Javascript
关于取不到由location.href提交而来的上级页面地址的解决办法
2009/07/30 Javascript
Jquery 实现Tab效果 思路是js思路
2010/03/02 Javascript
有关DOM元素与事件的3个谜题
2010/11/11 Javascript
jquery 获取标签名(tagName)示例代码
2013/07/11 Javascript
javascript中字符串的定义示例代码
2013/12/19 Javascript
js中的for如何实现foreach中的遍历
2014/05/31 Javascript
JS实现OCX控件的事件响应示例
2014/09/17 Javascript
每天一篇javascript学习小结(基础知识)
2015/11/10 Javascript
node.js插件nodeclipse安装图文教程
2020/10/19 Javascript
vue中使用vue-cli接入融云实现即时通信
2019/04/19 Javascript
小程序如何构建骨架屏
2019/05/29 Javascript
[02:39]DOTA2英雄基础教程 极限穿梭编织者
2013/12/05 DOTA
[50:50]完美世界DOTA2联赛PWL S3 INK ICE vs DLG 第一场 12.20
2020/12/23 DOTA
python中stdout输出不缓存的设置方法
2014/05/29 Python
Python的Django应用程序解决AJAX跨域访问问题的方法
2016/05/31 Python
Python常见加密模块用法分析【MD5,sha,crypt模块】
2017/05/24 Python
python 顺时针打印矩阵的超简洁代码
2018/11/14 Python
利用python GDAL库读写geotiff格式的遥感影像方法
2018/11/29 Python
python 实现倒排索引的方法
2018/12/25 Python
python实现大量图片重命名
2020/03/23 Python
python使用selenium爬虫知乎的方法示例
2020/10/28 Python
Python+MySQL随机试卷及答案生成程序的示例代码
2021/02/01 Python
详解CSS3中强大的filter(滤镜)属性
2017/06/29 HTML / CSS
英国领先的珍珠首饰品牌:Orchira
2016/09/11 全球购物
Booking.com荷兰:全球酒店网上预订
2017/08/22 全球购物
抽象类和接口的区别
2012/09/19 面试题
马云北大演讲完整版:真心话,什么才是阿里的核心竞争力?
2014/04/04 职场文书
小学生思想品德评语
2014/12/31 职场文书
2016年“我们的节日·中秋节”活动总结
2016/04/05 职场文书
mysql的单列多值存储实例详解
2022/04/05 MySQL