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 相关文章推荐
js 代码优化点滴记录
Feb 19 Javascript
用客户端js实现带省略号的分页
Apr 27 Javascript
js传参数受特殊字符影响错误的解决方法
Oct 21 Javascript
二叉树先序遍历的非递归算法具体实现
Jan 09 Javascript
javascript中兼容主流浏览器的动态生成iframe方法
May 05 Javascript
JavaScript常用脚本汇总(一)
Mar 04 Javascript
Windows系统下Node.js的简单入门教程
Jun 23 Javascript
jQuery Easyui Datagrid实现单行的上移下移及保存移动的结果
Aug 15 Javascript
KnockoutJS 3.X API 第四章之数据控制流with绑定
Oct 10 Javascript
Angular表单验证实例详解
Oct 20 Javascript
详解RequireJs官方使用教程
Oct 31 Javascript
深入了解js原型模式
May 30 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 UTF8编码内的繁简转换类
2009/07/20 PHP
php中怎么搜索相关联数组键值及获取之
2013/10/17 PHP
PHP 生成N个不重复的随机数
2015/01/21 PHP
php双层循环(九九乘法表)
2017/10/23 PHP
PHP之认识(二)关于Traits的用法详解
2019/04/11 PHP
laravel model模型定义实现开启自动管理时间created_at,updated_at
2019/10/17 PHP
PHP实现限制域名访问的实现代码(本地验证)
2020/09/13 PHP
jQuery使用动态渲染表单功能完成ajax文件下载
2013/01/15 Javascript
jQuery页面图片伴随滚动条逐渐显示的小例子
2013/03/21 Javascript
用jquery修复在iframe下的页面锚点失效问题
2014/08/22 Javascript
jQuery 3.0 的 setter和getter 模式详解
2016/07/11 Javascript
bootstrap实现动态进度条效果
2017/03/08 Javascript
详解angular element()方法使用
2017/04/08 Javascript
React利用插件和不用插件实现双向绑定的方法详解
2017/07/03 Javascript
Angular.js ng-file-upload结合springMVC的使用教程
2017/07/10 Javascript
基于openlayers4实现点的扩散效果
2020/08/17 Javascript
swiper 解决动态加载数据滑动失效的问题
2018/02/26 Javascript
详解Ant Design of React的安装和使用方法
2018/12/27 Javascript
通过vue写一个瀑布流插件代码实例
2019/09/07 Javascript
vue vantUI实现文件(图片、文档、视频、音频)上传(多文件)
2019/10/15 Javascript
Vue 解决多级动态面包屑导航的问题
2019/11/04 Javascript
javascript 设计模式之组合模式原理与应用详解
2020/04/08 Javascript
JavaScript 声明私有变量的两种方式
2021/02/05 Javascript
python3 实现的人人影视网站自动签到
2016/06/19 Python
python接口调用已训练好的caffe模型测试分类方法
2019/08/26 Python
Python ArgumentParse的subparser用法说明
2020/04/20 Python
python神经网络编程实现手写数字识别
2020/05/27 Python
css3实现可滑动跳转的分页插件示例
2014/05/08 HTML / CSS
英国拳击装备购物网站:RDX Sports
2018/01/23 全球购物
什么是用户模式(User Mode)与内核模式(Kernel Mode) ?
2014/07/21 面试题
空中乘务员岗位职责
2014/03/08 职场文书
大学生找工作求职信
2014/07/09 职场文书
社区党建工作汇报材料
2014/08/14 职场文书
2014年企业党支部工作总结
2014/12/04 职场文书
实施意见格式范本
2015/06/05 职场文书
社区宣传标语口号
2015/12/26 职场文书