jQuery.each( object, callback,arg)
each()函数是基本上所有的框架都提供了的一个工具类函数,通过它,你可以遍历对象、数组的属性值并进行处理。
jQuery和jQuery对象都实现了该方法,对于jQuery对象,只是把each方法简单的进行了委托:把jQuery对象作为第一个参数传递给jQuery的each方法。换句话说:jQuery提供的each方法是对参数一提供的对象的中所有的子元素逐一进行方法调用。而jQuery对象提供的each方法则是对jQuery内部的子元素进行逐个调用。
jQuery.prototype.each = function(fn, args) {
return jQuery.each(this, fn, args);
}
让我们看一下jQuery提供的each方法的具体实现,
jQuery.each(obj,fn,arg)
该方法有三个参数:进行操作的对象obj,进行操作的函数fn,函数的参数args。
让我们根据ojb对象进行讨论:
1.obj对象是数组
each方法会对数组中子元素的逐个进行fn函数调用,直至调用某个子元素返回的结果为false为止,也就是说,我们可以在提供的fn函数进行处理,使之满足一定条件后就退出each方法调用。当each方法提供了arg参数时,fn函数调用传入的参数为arg,否则为:子元素索引,子元素本身
2.obj 对象不是数组
该方法同1的最大区别是:fn方法会被逐次不考虑返回值的进行进行。换句话说,obj对象的所有属性都会被fn方法进行调用,即使fn函数返回false。调用传入的参数同1类似。
jQuery.each = function(obj, fn, args) {
if (args) {
if (obj.length == undefined) {
for (var i in obj)
fn.apply(obj, args);
} else {
for (var i = 0, ol = obj.length; i < ol; i++) {
if (fn.apply(obj, args) === false)
break;
}
}
} else {
if (obj.length == undefined) {
for (var i in obj)
fn.call(obj, i, obj);
} else {
for (var i = 0, ol = obj.length, val = obj[0];
i < ol && fn.call(val, i, val) !== false;
val = obj[++i]) { }
}
}
return obj;
}
需要特别注意的是each方法中fn的具体调用方法并不是采用简单的fn(i,val)或fn(args),而是采用了fn.call(val,i,val)或fn.apply(obj.args)的形式,这意味着,在你自己的fn的实现中,可以直接采用this指针引用数组或是对象的子元素。这种方式是绝大多数jQuery所采用的一种实现方式。
var arr = ["one", "two", "three", "four", "five"];
var obj = { one: 1, two: 2, three: 3, four: 4, five: 5 };
jQuery.each(arr, function() {
alert(this);
});
/*
one,two,three,four,five
*/
jQuery.each(obj, function(i, val) {
alert(i+":"+val);
});
/*
one:1 two:2 three:3 four:4 five:5
*/
jQuery.each(arr, function(i, val) {
alert(i);
});
/*
0,1,2,3,4
*/
jQuery.each(arr, function(i, val) {
alert(arr[i]);
});
/*
one tow three four five
*/
引自blog 大道至简 http://www.cnblogs.com/jams742003/archive/2009/12/25/1632218.html
相关推荐
现在,我们将详细讲解“隐式迭代”、“链式编程”以及“jQuery插件”。 1. **隐式迭代**: jQuery的一个显著特性是它的选择器功能,它允许开发者通过CSS选择器轻松地选取DOM元素。当一个jQuery对象被创建后,所有...
jQuery会自动将JSON字符串转换为JavaScript对象,因此我们可以直接通过键来访问数据: ```javascript success: function(data) { console.log(data.name); // 输出 "John" console.log(data.age); // 输出 30 ...
jQuery的集合处理功能非常强大,它内置了`each()`方法,使得对一组元素的迭代操作变得简单。例如,`$("p").each(function(i){...})`可以方便地遍历所有`<p>`元素并执行特定操作,如改变字体颜色。类似的,`$("tr")....
例如,`call()`和`apply()`可以让`$.each()`遍历任何可迭代对象,不仅仅是jQuery对象。 总的来说,jQuery的原型关系图揭示了jQuery如何通过原型链和继承来实现其强大的功能和灵活性。通过深入理解和研究这个图,...
jQuery1.5着重于Ajax功能的增强,引入了Promise对象,这是异步编程的一个重要概念,它使处理多个并发请求变得更加简单和有序。此外,jQuery1.5还加强了对JSONP的支持,便于跨域数据交互。 jQuery1.6的主要改进是...
6. **链式操作**:jQuery对象返回的是jQuery实例,允许连续调用多个方法,如`$("div").addClass("highlight").css("color", "red");`。 7. **版本迭代**:jQuery 3.x系列主要关注性能优化和现代浏览器的兼容性,...
- **特点**:将独立的函数添加到 jQuery 的命名空间中,可以直接通过 `$` 或 `jQuery` 对象来调用。 - **应用场景**:适合实现一些通用的功能,例如 AJAX 请求或数据处理等。 - **示例**:例如,你可以添加一个 `...
jQuery 1.1 版本是该库的一个重要迭代,它提供了许多功能增强和性能优化。在这个离线版的jQuery 1.1中文文档中,用户可以深入理解其API和功能。 1. **基本概念** - **选择器**:jQuery 的核心在于强大的选择器功能...
6. **链式操作**: jQuery对象是链式操作的基础,一个方法调用后可以立即调用另一个方法,如`$("#element").addClass("highlight").fadeIn(500)`。 7. **插件生态**: jQuery拥有庞大的插件生态系统,如jQuery UI提供...
10. **$.each()**:这是一个迭代函数,可用于遍历数组或对象,处理每个元素或属性。 总的来说,"jquery-3.6.0.min.zip"包含的jQuery库是现代Web开发中的重要工具,它提供了高效的DOM操作、优雅的API和强大的功能,...
- `.each()`: 遍历集合并执行回调函数,常用于数组和对象的迭代。 - `.ready()`: 当DOM准备就绪时执行指定的函数,确保在操作DOM之前页面已完全加载。 - `.ajax()`: 实现异步HTTP请求,支持GET和POST等多种HTTP...
7. 隐式迭代:jQuery会自动遍历获取到的对象集合,无需手动编写循环代码。 8. 丰富的插件:jQuery生态中拥有众多稳定且实用的插件,极大地提高了开发效率。 9. 开源:jQuery是开源的,允许自由使用,并且得益于全球...
随着技术的发展,jQuery也在不断迭代更新,以适应新的前端需求。 总的来说,jQuery作为一款强大的JavaScript库,极大地提高了开发效率,降低了开发难度,是Web开发者的得力助手。这个压缩包中的“jquery.min.js”是...
`jQuery.each()` 用于迭代对象或数组,而 `$(document).ready()` 用于确保页面加载完成后再执行代码。 10. **版本差异** - jQuery 1.4.1 相比于之前的版本,可能会有性能提升、bug 修复和新的 API 添加。例如,...
7. **版本更新**:jQuery 1.8.3之后,jQuery持续进行版本迭代,引入更多新特性并修复已知问题,但1.8.3因其稳定性和兼容性,至今仍被许多项目所采用。 总的来说,jQuery 1.8.3以其易用性和强大的功能,为前端开发者...
合理的选择器使用、事件委托、缓存jQuery对象、减少DOM操作等都是提高性能的最佳实践。此外,随着前端技术的迭代,了解jQuery与现代JavaScript框架(如React, Angular, Vue)的集成和使用方式同样重要。 知识点十:...
jQuery提供了多种遍历和过滤方法,如`.each()`用于迭代集合中的每个元素,`.first()`和`.last()`选取第一个或最后一个元素,`.filter()`和`.not()`用于筛选满足条件的元素。 四、DOM操作 jQuery允许开发者轻松地...
10. **$.each()**:这是一个遍历对象或数组的迭代器,可以用来执行自定义操作。 在升级到jQuery 1.12.4时,可能遇到的问题主要是代码不兼容性。由于新版本可能移除了某些过时的方法或者改变了某些行为,因此在升级...
1. `$.each()`:这是jQuery提供的一种迭代函数,可以用于遍历任何可迭代对象,包括数组。它接受两个参数,第一个是目标对象,第二个是一个回调函数,回调函数的两个参数分别是当前元素的索引和值。例如: ```...
该项目是一款基于jQuery和面向对象的redjs前端框架设计源码,包含1148个文件,涵盖了506个...redjs历经1.0至3.0版本的迭代,不断优化易用性和性能,集成jQuery交互处理能力,致力于提升Web项目的开发效率和布局复用性。