`
lily_better
  • 浏览: 7878 次
文章分类
社区版块
存档分类
最新评论

jQuery.each()用法

 
阅读更多
昨天写了个小插件,用到这个方法,不太明白$.each()这个方法,今天查了下手册,学习一下。



例遍数组,同时使用元素索引和内容。(i是索引,n是内容)

$.each( [0,1,2], function(i, n){
    alert( "Item #" + i + ": " + n );
});

例遍对象,同时使用成员名称和变量内容。(i是成员名称,n是变量内容)

$.each( { name: "John", lang: "JS" }, function(i, n){
    alert( "Name: " + i + ", Value: " + n );
});

例遍dom元素,此处以一个input表单元素作为例子。

如果你dom中有一段这样的代码
<input name="aaa" type="hidden" value="111" />
<input name="bbb" type="hidden" value="222" />
<input name="ccc" type="hidden" value="333" />
<input name="ddd" type="hidden"  value="444"/>
然后你使用each如下

$.each($("input:hidden"), function(i,val){ 
   alert(val);         //输出[object HTMLInputElement],因为它是一个表单元素。
   alert(i);           //输出索引为0,1,2,3
   alert(val.name);    //输出name的值
   alert(val.value);   //输出value的值
}); 



以下是官方的解释:

jQuery.each(object, [callback])
概述

通用例遍方法,可用于例遍对象和数组。

不同于例遍 jQuery 对象的 $().each() 方法,此方法可用于例遍任何对象。回调函数拥有两个参数:第一个为对象的成员或数组的索引,第二个为对应变量或内容。如果需要退出 each 循环可使回调函数返回 false,其它返回值将被忽略。
参数
objectObject

需要例遍的对象或数组。
callback (可选)Function

每个成员/元素执行的回调函数。
分享到:
评论

相关推荐

    jQuery源码分析之jQuery.fn.each与jQuery.each用法

    本文实例讲述了jQuery源码分析之jQuery.fn.each与jQuery.each用法。分享给大家供大家参考。具体分析如下: 先上例子,下面代码的作用是:对每个选中的div元素,都给它们添加一个red类 复制代码 代码如下:$(‘div’)....

    jquery手册(jquery.cuishifeng.cn网页版)2

    10. **性能优化**: 使用`$(document).ready()`确保DOM加载完成后执行脚本,减少DOM操作以提高性能,使用 delegated event handling 处理大型动态内容等都是jQuery性能优化的技巧。 离线的HTML版本的jQuery手册不仅...

    jquery.imgpreload-master

    在使用"jquery.imgpreload-master"时,你需要先在项目中引入jQuery库,然后引入该插件的JS文件。接下来,你可以通过调用$.fn.imgpreload()方法,传入图片元素的选择器或者图片URL数组,来启动预加载过程。例如: ``...

    jquery库文件(jquery.min.rar)

    9. **工具函数**:jQuery还提供了一些实用的工具函数,如`$.each()`, `$.extend()`, `$.trim()`等,方便开发者处理数组、对象和字符串。 10. **版本更新**:“jquery.min.js”是jQuery的最小化版本,适合生产环境...

    jquery.tmpl.js

    三、使用方法 1. **引入库**:首先,需要在HTML文件中引入jQuery库和tmpl.js文件。 2. **创建模板**:在HTML中,我们可以使用`&lt;script type="text/x-jquery-tmpl"&gt;`标签定义模板。 3. **定义数据**:创建一个JSON...

    jQuery.js执行过程分析

    这些方法包括但不限于`each`、`find`等,它们构成了jQuery的基础功能。通过这种方式,所有由jQuery构造的实例都可以访问这些方法。 4. **静态方法扩展**: `jQuery.extend`是一个静态方法,用于扩展jQuery自身的...

    jQuery.each使用详解

    了解和掌握jQuery.each方法的使用,对于进行Web前端开发尤为重要。 首先,jQuery.each方法可以接受两个参数,第一个是要遍历的数组或对象,第二个是回调函数。在回调函数中,会传递两个参数,第一个参数是数组的...

    jquery.query.js

    4. 遍历与迭代:$.each()方法提供了遍历对象或数组的能力,可以方便地进行循环操作。 5. 条件判断:$.if()和$.switch()模拟了条件语句,使得JavaScript代码更接近自然语言,易于理解和维护。 6. 数组和对象操作:$...

    jquery $.each json 获取json 数据

    要使用jQuery的$.each函数解析JSON数据,首先你需要将JSON字符串转换为JavaScript对象,这可以通过`JSON.parse()`方法实现。例如: ```javascript var jsonString = '{"name":"John","age":30,"city":"New York"}';...

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

    与原生JavaScript相比,jQuery的事件处理更加灵活,可以使用`.on()`方法绑定事件,支持事件委托,增强了代码的可维护性。同时,jQuery还提供了`.trigger()`方法来触发自定义事件,实现了模块间的通信。 在动画效果...

    jQuery.each()用法分享

    本文将详细介绍jQuery.each()方法的使用方式和应用场景。 首先,我们来看一下jQuery.each()方法的基本语法。它接受两个参数:第一个是要遍历的对象或数组,第二个是一个可选的回调函数,该函数在遍历过程中的每一个...

    jQuery的$.each()遍历数组或对象的用法

    $.each()遍历数组或对象的具体用法

    jquery.tmpl.js使用例子

    这篇教程将深入探讨tmpl.js的使用方法和技巧,帮助你更好地理解和应用这一强大的工具。 首先,tmpl.js的核心理念是通过模板语法来生成HTML。模板通常是一段HTML代码,其中包含了一些特殊的标记,这些标记会被...

    jQuery-each用法全面总结

    ### jQuery-each用法全面总结 #### 一、概述 `jQuery.each` 是一个非常实用且灵活的方法,用于遍历JavaScript中的对象、数组以及其他可枚举的数据结构。它支持多种用法,包括带有附加参数的遍历以及不带附加参数的...

    使用AJAX动态生成table表格数据和jquery.pagination.js 的分页栏

    假设服务器返回的是JSON格式的数据,我们可以使用`$.each()`遍历数据,然后用`$('&lt;tr&gt;...&lt;/tr&gt;')`创建新的行元素,再将它们添加到表格的`&lt;tbody&gt;`中。 接下来,我们将引入`jquery.pagination.js`来实现分页功能。...

    浅谈jquery中的each方法$.each、this.each、$.fn.each

    在jQuery库中,`each`方法是一个非常常用且强大的功能,它允许我们遍历集合中的每个元素,并对每个元素执行特定的操作。这篇文章将详细讲解`$.each`、`this....希望本文的介绍对理解和使用jQuery的`each`方法有所帮助。

    jQuery中$.each()函数的用法引申实例_.docx

    本文将详细介绍`$.each()`函数的基本用法、高级技巧以及实际应用场景。 #### 二、基础语法 `$.each()`函数的基本语法如下: ```javascript $.each(collection, callback); ``` - `collection`:需要遍历的集合,...

    jquery.chm

    同时,$.each()方法可用于遍历元素集合,实现对每个元素的定制操作。 三、DOM操作 jQuery封装了大量DOM操作方法,如.html()、.text()、.attr()用于设置或获取元素内容和属性,.append()、.prepend()用于在元素内部...

Global site tag (gtag.js) - Google Analytics