`
lelong
  • 浏览: 548309 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

jQuery 中each()方法的讲解(转)

 
阅读更多

 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所采用的一种实现方式。

分享到:
评论

相关推荐

    Jquery each方法跳出循环,并获取返回值(实例讲解)

    return false:将停止循环 (就像在普通的循环中使用 ‘break’)。return true:跳至下一个循环(就像...}jquery是对象链,所以$(..).each()返回的还是对象集合。each(function(){}):是回调函数,在回调函数里不能返回结

    JQuery跳出each循环的方法

    主要介绍了JQuery跳出each循环的方法,本文讲解了jquery怎么跳出当前的each循环、Jquery each方法跳出循环并获得返回值的方法等内容,需要的朋友可以参考下

    jQuery each函数源码分析

    jQuery.each方法用于遍历一个数组或对象,并对当前遍历的元素进行处理,在jQuery使用的频率非常大,下面就这个函数做了详细讲解: 代码 /*! * jQuery源码分析-each函数 * jQuery版本:1.4.2 * * --------------------...

    jQuery权威指南-源代码

    其次详细讲解了jQuery的各种选择器、jQuery操作DOM的方法、jQuery中的事件与应用、jQuery中的动画和特效、Ajax在jQuery中的应用,以及各种常用的jQuery插件的使用方法和技巧,所有这些知识点都配有完整的示例(包括...

    jQuery详细教程

    jQuery详细教程,讲解很透彻, 一. jQuery 语法实例 $(this).hide() 演示 jQuery hide() 函数,隐藏当前的 HTML 元素。 $("#test").hide() 演示 jQuery hide() 函数,隐藏 id="test" 的元素。 $("p").hide() ...

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

    主要介绍了JQuery中$.each 和$(selector).each()的区别详解,本文给出了多个例子讲解了它们之间的不同之处,需要的朋友可以参考下

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

    主要介绍了jQuery $.each遍历对象、数组用法实例,本文讲解了在有参数和无参数的情况下遍历对象及遍历数组的例子及each方法的几种常用用法,需要的朋友可以参考下

    jquery遍历select元素(实例讲解)

    本篇文章提供一款jquery遍历select教程代码,主要是利用了$(“#&lt;&#37;=ddl_xreg_id.clientid%&gt; option”).each(function() {形式来each遍历一次,这样所有的select就给查询了一次。 代码如下:[removed][removed]...

    jQuery筛选数组之grep、each、inArray、map的用法及遍历json对象

    本文主要介绍jQuery中grep、each、inArray、map的用法,并附实例讲解,非常实用,有需要的朋友可以参考一下。

    举例讲解jQuery对DOM元素的向上遍历、向下遍历和水平遍历

    使用jQuery可以更加容易地遍历DOM的父级、子级和同级元素,这里我们就来举例讲解jQuery对DOM元素的向上遍历、向下遍历和水平遍历:

    简易快餐在线订购功能实现

    使用jquery的each,find,css来完成一个建议的快餐在线订购系统。主要向大家讲解一下这几个函数方法的使用,希望对您有帮助。

    jQuery 循环遍历改变a标签的href(实例讲解)

    把info类下面所有的a标签链接后天加”#article”。 ...以上这篇jQuery 循环遍历改变a标签的href(实例讲解)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持软件开发网。

    利用jQuery实现WordPress中@的ID悬浮显示评论内容

    @A How much money do you have? 就是说, 当鼠标悬停在 @A 上面的时候, 就会将 A 的评论内容显示在一个悬浮区域中. 实现步骤 在这里我们将以iNove主题为例进行... jQuery('#thecomments li p a').each( function() {

    使用JQuery快速实现Tab的AJAX动态载入(实例讲解)

    下面我就简单讲一下实现过程: 1.找到链接源,我这里是一串的Li下的链接 2.处理样式 ...5.Over了....脚本: 代码如下: { //homeNews var tid = “#homeNews”;...= null) { lvTabs.find(“a”).each(function()

Global site tag (gtag.js) - Google Analytics