`

jquery的$().each,$.each的区别(转载)

 
阅读更多

原文地址:http://www.frontopen.com/1394.html

在jquery中,遍历对象和数组,经常会用到$().each和$.each(),两个方法。两个方法是有区别的,从而这两个方法在针对不同的操作上,显示了各自的特点。

$().each,对于这个方法,在dom处理上面用的较多。如果页面有多个input标签类型为checkbox,对于这时用$().each来处理多个checkbook,例如:

$(“input[name=’ch’]”).each(function(i){
if($(this).attr(‘checked’)==true)
{
//一些操作代码

}

回调函数是可以传递参数,i就为遍历的索引。

对于遍历一个数组,用$.each()来处理,简直爽到了极点。例如:

$.each([{“name”:”limeng”,”email”:”xfjylimeng”},{“name”:”hehe”,”email”:”xfjylimeng”},function(i,n)
{
alert(“索引:”+i,”对应值为:”+n.name);
});

参数i为遍历索引值,n为当前的遍历对象.

 

var arr1 = [ “one”, “two”, “three”, “four”, “five” ];
$.each(arr1, function(){
alert(this);
});
输出:one   two  three  four   five
var arr2 = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]
$.each(arr2, function(i, item){
alert(item[0]);
});
输出:1   4   7
var obj = { one:1, two:2, three:3, four:4, five:5 };
$.each(obj, function(key, val) {
alert(obj[key]);
});
输出:1   2  3  4  5

 

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

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

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

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

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

引用网上有一个很经典的例子

Js代码
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方法的几种常用的用法

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 json 获取json 数据

    $.each函数是jQuery中一个重要的迭代器,它允许我们遍历数组或对象,包括JSON数据。本篇文章将深入探讨如何使用jQuery的$.each函数来获取并处理JSON数据。 首先,我们需要了解JSON(JavaScript Object Notation),...

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

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

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

    $.each([1,2,3,4],function(){  //$(this)==数组中的每一个数组(如果数组是对象,就是对象) }); 方法三 应有场景有点不一样 this.each(function(){ }) 扩展jQuery对象方法 应该是 j

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

    ### jQuery中$.each()函数的深入理解与应用 #### 一、概述 在现代Web开发中,jQuery作为一个非常流行的JavaScript库,提供了丰富的功能和简洁的API来简化HTML文档遍历、事件处理、动画以及Ajax交互等操作。其中,`...

    JQuery $.each遍历JavaScript数组对象实例

    在JavaScript和jQuery中,`$.each`函数是一个非常实用的工具,用于遍历数组或对象。这个函数允许我们对集合中的每个元素执行某些操作。在本例中,我们将深入探讨如何使用`$.each`处理JSON数据,特别是从JSON字符串...

    Jquery实现$.fn.extend和$.extend函数_.docx

    在JavaScript中,jQuery库提供了两种扩展对象的方法,即`$.fn.extend`和`$.extend`。它们都用于增加或修改现有对象的功能,但应用场景不同。本文将深入解析这两种方法的实现原理和用途。 首先,`$.fn.extend`是用于...

    javascript $.each用法例子

    JavaScript中的`$.each()`函数是jQuery库提供的一种便利的迭代工具,它允许开发者遍历数组或对象的所有元素。这个函数非常灵活,可以用于处理多种数据结构,尤其在处理DOM操作和数据绑定时非常实用。 首先,我们要...

    jQuery $.each的用法说明

    $.each()函数是jQuery中用于遍历数组或对象的通用方法,它允许开发者执行一个函数,对数组的每个元素或对象的每个属性进行操作。 首先,来看一下$.each()方法的基本用法。$.each()方法可以接收两个参数:第一个参数...

    jQuery $.each遍历对象、数组用法实例

    jQuery的$.each方法是用于遍历对象或数组的一个强大工具,它提供了灵活的方式来处理数据集合中的每个元素或属性。在JavaScript中,遍历通常是为了执行某种操作,如修改、检查或计算。$.each方法有两种主要的用法,一...

    jquery $.each()使用探讨

    `jQuery` 的 `$.each()` 方法是用于遍历对象或数组的一个强大工具,它在JavaScript开发中被广泛使用,尤其是在处理jQuery对象时。这个方法允许我们对集合中的每个元素执行一个函数,提供了一种简洁的方式来迭代数组...

    jQuery中$.each使用详解

    在 jQuery 中,$.each 函数是一个非常强大的工具,它允许开发者遍历对象或者数组,并对每个元素执行指定的操作。$.each 函数既可以处理 JavaScript 的数组和对象,也可以处理 jQuery 对象,如通过选择器获取的元素...

    jquery $.each 和for怎么跳出循环终止本次循环

    2、而在jquery中 $.each则对应的使用return true 和return false。 break可以跳出switch…case语句,继续执行switch语句后面的内容。break语句还可以跳出循环,也就是结束循环语句的执行。 continue语句的作用为...

    jquery的$().each和$.each的区别

    这个函数和之前项目里面用到的遍历数据的函数不是同一个呀(项目里面用到的函 数:$.each(dataresource,function(index,element))),于是,就好好研究了下,果然在JS里面有两个相似的函数,于是也就有了今天的主题...

    JS中的forEach、$.each、map方法推荐

    在JavaScript中,数组遍历是常见的操作,有多种方法可以实现这一目的,其中包括`forEach`、`$.each`(jQuery库中的方法)以及`map`。这些方法在处理数组时各有特点,适用于不同的场景。 首先,`forEach`是...

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

    在JavaScript的世界里,遍历数据结构是常见的操作,jQuery提供了$.each()函数,它为开发者提供了方便、灵活的方式来遍历数组、对象或者其他集合。本文将深入解析jQuery中$.each()函数的用法,并通过实例来展示其功能...

    jQuery通用的全局遍历方法$.each()用法实例

    而$.each()是jQuery提供的一个非常实用的全局遍历方法,它允许开发者通过一个简单的函数轻松遍历数组和对象。在本文中,我们将详细讲解$.each()方法的用法,并通过实例展示如何利用这一方法来处理JSON数据和动态构建...

    JQuery中$.each 和$(selector).each()的区别详解

    在JQuery中,有两个经常被用来遍历对象和数组的函数,分别是$.each和$(selector).each()。这两个函数虽然功能相似,但它们的用法和适用范围有所不同。 $.each函数是一个通用的遍历函数,它可以用来遍历数组、对象,...

    jQuery使用$.each遍历json数组的简单实现方法

    ### jQuery使用$.each方法遍历JSON数组 #### 1. jQuery $.each方法概述 jQuery中的$.each方法是一个强大的工具,它允许开发者遍历JavaScript数组或对象。它模仿了jQuery中的其他迭代方法,比如$.map、$.grep等,但...

Global site tag (gtag.js) - Google Analytics