`
bevis.cn
  • 浏览: 153912 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
社区版块
存档分类
最新评论

JQuery学习---each

阅读更多
在jQuery里有一个each方法,用起来非常的爽,不用再像原来那样写for循环,jQuery源码里自己也有很多用到each方法。

其实jQuery里的each方法是通过js里的call方法来实现的。

下面简单介绍一下call方法。
call这个方法很奇妙,其实官方的说明是:“调用一个对象的一个方法,以另一个对象替换当前对象。”网上更多的解释是变换上下文环境,也有说是改变上下文this指针。
call([thisObj[,arg1[, arg2[,   [,.argN]]]]])

参数
thisObj
可选项。将被用作当前对象的对象。
arg1, arg2,  , argN
可选项。将被传递方法参数序列。

说明
call 方法可以用来代替另一个对象调用一个方法。call 方法可将一个函数的对象上下文从初始的上下文改变为由 thisObj 指定的新对象。

引用网上有一个很经典的例子
function add(a,b)
{
    alert(a+b);
}
function sub(a,b)
{
    alert(a-b);
}
add.call(sub,3,1);

用 add 来替换 sub,add.call(sub,3,1) == add(3,1) ,所以运行结果为:alert(4);
注意:js 中的函数其实是对象,函数名是对 Function 对象的引用。

具体call更深入的就不在这里提了。

下面提一下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 




2
0
分享到:
评论
3 楼 空空儿 2010-01-06  
好神奇哟。。。学到一点啦。。。
2 楼 vb2005xu 2009-12-25  
实现 很简单啊
1 楼 vb2005xu 2009-12-25  
// ------------------- xu.array命名空间
xu.pkg('xu.array') ;
xu.array.each = function(ar, insp) {
var r = [];
for (var i = 0; i < ar.length; i++) {
var x = insp(ar[i], i);
if (x !== null) {
r.push(x);
}
}
return r ;
};

相关推荐

    jQueryAPI-090129.rar jQueryAPI-090129文档

    除此之外,jQuery还提供了许多便利的工具方法,如"$().each()"遍历集合,"$().is()"检查元素是否匹配某个选择器,"$().data()"管理元素的数据存储,"$().unwrap()"移除元素的父元素,"$().unique()"去除重复的元素等...

    jQuery-1.12.4.js和jQuery-1.8.3.min.js

    jQuery是JavaScript库中的一个巨头,以其简单易用的API和强大的功能著称。"jQuery-1.12.4.js" 和 "jQuery-1.8.3.min.js" 是两个不同版本的...在学习jQuery时,了解各个版本的特点和变化,有助于深入理解和应用这个库。

    jquery-1.2.6-vsdoc

    jQuery 1.2.6-VSDOC中文版的出现,极大地便利了中国开发者对jQuery的学习和使用。尽管版本较旧,但其基础功能和思想仍然对现代前端开发具有指导意义。理解并掌握jQuery的核心特性,能够提升我们的开发效率,为项目...

    最新JQuery类库 -- JQuery1.4

    **jQuery 1.4:一个高效、易用的JavaScript库** ...无论你是初学者还是经验丰富的开发者,jQuery 1.4都是值得学习和使用的工具。通过深入理解和实践,你可以构建出功能强大且用户体验优秀的Web应用。

    jquery-3.4.1.rar

    《jQuery 3.4.1:深入理解与应用》 jQuery,这个JavaScript库,自2006年发布以来,以其简洁的API和强大的功能,迅速成为开发者们首选...通过学习和实践,我们可以更好地利用jQuery提供的工具,创造更加优秀的Web应用。

    jquery-1.12.4.zip下载

    在实际开发中,jQuery提供了丰富的API供开发者使用,如选择器($.selector)、遍历($.each)、DOM操作($.append、$.html)以及事件处理($.on、$.off)。此外,jQuery的动画功能也是其一大亮点,例如$.fadeIn()、$...

    jQueryAPI-100214

    9. **工具方法**: jQuery还提供了一些通用的工具函数,如`$.each()`遍历对象或数组,`$.trim()`去除字符串两端的空白,`$.inArray()`检查元素是否存在于数组中。 10. **事件代理**: 使用`$(parent).on('event', ...

    超赞JQuery集合-76个

    9. **遍历与筛选**:`each()`方法用于循环遍历jQuery对象,`filter()`和`:first`, `:last`, `:even`, `:odd`等选择器则用于筛选元素。 10. **自定义事件**:开发者可以通过`$.event.special`创建自定义事件,增强...

    jquery-1.3.2.js和jquery.min-1.3.2.js

    此外,jQuery提供了一套丰富的API,如`$(document).ready()`用于页面加载完成后执行函数,`$.ajax()`用于异步数据交互,`$.each()`用于遍历数组或对象,等等。 在jQuery 1.3.2中,性能优化是一个重要方面。"jquery....

    jquery-1.4.2-vsdoc.js中英双语版.rar

    这个中英双语版的文档,不仅方便了英语熟练的开发者,也照顾到了中文使用者的需求,降低了学习和使用的门槛。 首先,jQuery 1.4.2中的主要改进包括性能提升和API的增强。例如,$.each()函数在处理大型数据集时的...

    JQuery1.4.1

    - 学习资源:jQuery官方文档是学习的最佳来源,此外还有许多社区教程和插件可供参考。 总结来说,jQuery 1.4.1 提供了高效、简洁的JavaScript编程方式,它在DOM操作、事件处理、Ajax和动画方面都表现出色。虽然现在...

    jQuery学习记录----处理XML数据(二)

    在本篇博客“jQuery学习记录----处理XML数据(二)”中,我们将深入探讨如何使用jQuery库来解析和操作XML文档。XML(eXtensible Markup Language)是一种用于存储和传输结构化数据的标准格式,广泛应用于Web应用程序...

    jqueryAPI-1.4

    《jQuery API 1.4 入门指南及深入解析》 ...本教程将深入探讨这个版本的jQuery API,帮助开发者们更好地理解和应用这一强大的工具。 1. **基础概念** ...希望这能对大家的jQuery学习之路带来实质性的帮助。

    jQuery1.8.3-20121215.zip(jQuery语法包)

    - **jQuery1.8.3_20121215.chm**:这是一个帮助文件,通常包含jQuery API的详细文档,用户可以通过查阅此文件了解每个函数的具体用法、参数和返回值,便于学习和调试。 4. **使用场景** - **网页动态化**:jQuery...

    jquery1.2-1.7

    这些文件旨在提供jQuery的下载资源和相关学习平台链接,帮助开发者快速获取所需版本,同时了解和学习jQuery的相关知识。 总结,jQuery 1.2至1.7版本在网页开发中扮演了重要角色,它们不断进化和完善,满足了开发者...

    jQuery学习记录----股票信息实时显示(七)

    在本篇博客“jQuery学习记录----股票信息实时显示(七)”中,作者分享了如何使用jQuery技术来实现股票信息的实时更新展示。这涉及到Web开发中的动态数据获取和前端界面交互,是JavaScript库jQuery的一个实际应用...

    JQuery插件-JQuery的几个精典应用实例

    **jQuery是JavaScript库中的佼佼者,以其简洁的API和强大的功能深受开发者喜爱。本教程将探讨几个jQuery的精彩应用实例,包括菜单设计、文件上传、树形结构...持续学习和实践jQuery,将使你在Web开发领域更加得心应手。

    jquery1.3-中文API.rar

    用户可以通过这个文件快速查找和学习jQuery 1.3的各个函数和方法。 以下是一些jQuery 1.3 API的关键知识点: 1. **选择器**:jQuery的选择器基于CSS,允许开发者高效地选取DOM元素,如`$("#id")`选取ID为"id"的...

    jQueryAPI-1.41.zip

    《jQuery API 1.41 入门指南与深度解析》 jQuery,作为一个广泛使用的JavaScript库,极大地简化了网页的DOM操作、事件处理、动画设计和Ajax交互。...而详细的API文档是不断学习和探索jQuery世界的关键工具。

    jquery-1.4版

    《jQuery 1.4版:深入解析与应用实践》 jQuery,这个JavaScript库自2006年发布以来,就以其简洁的API和强大的功能深受开发者...通过不断学习和实践,我们可以更好地利用jQuery来创建响应式、交互丰富的现代Web应用。

Global site tag (gtag.js) - Google Analytics