当前位置:编程学习 > JAVA >>

jQuery1.0源代码分析之构造函数完整注释(五)

 

jQuery的函数设计都很紧凑,相互调用很多。例如,你要看明白a函数,发现a里面调用b函数,b里面又调用c函数。这样一路跟下去,基本上就看晕了。

 

所以,我建议最好是一个函数一个函数的读懂,不要深跟,等通篇都看完一遍,自然就都通了。

 

 

所以今天把jQuery的构造函数注解一下。

 

 

function jQuery(a,c) { 

 

    // 处理ready函数,$(function() { }) 

    if ( a && a.constructor == Function && jQuery.fn.ready ) 

        return jQuery(document).ready(a); 

 

    // 给a设一个默认值 

    a = a || jQuery.context || document; 

 

    // 如果a是jQuery对象,把a和空数组合并,然后返回,这样做的目的是不破坏原来的jQuery对象。 

        //(注:jquery属性是每个jQuery对象都有的,值为jQuery的版本) 

    if ( a.jquery ) 

        return $( jQuery.merge( a, [] ) ); 

 

    // 如果c是jQuery对象,调用find函数,去查找 

    if ( c && c.jquery ) 

        return $( c ).find(a); 

     

    // 以上情况都不是,开始new jQuery对象 

    if ( window == this ) 

        return new jQuery(a,c); 

 

    // 如果a是html代码,$('<div />'),把html代码转成Dom元素 

        // jQuery.clean就是把html代码转换成Dom元素数组 

        var m = /^[^<]*(<.+>)[^>]*$/.exec(a); 

    if ( m ) a = jQuery.clean( [ m[1] ] ); 

 

    // 如果a是数组或者类数组,并且里面装的都是dom元素,把a和空数组合并一下 

        // 如果是其他情况,就调用find函数,find函数是处理css表达式的 

        // 最后调用get方法,做出jQuery对象返回         

        this.get( a.constructor == Array || a.length && !a.nodeType && a[0] != undefined && a[0].nodeType ? 

        // Assume that it is an array of DOM Elements 

        jQuery.merge( a, [] ) : 

 

        // Find the matching elements and save them for later 

        jQuery.find( a, c ) ); 

 

        // 最后看一下最后一个参数是不是Function,是的话遍历执行一下 

    var fn = arguments[ arguments.length - 1 ]; 

     

    if ( fn && fn.constructor == Function ) 

        this.each(fn); 

 

最后,从上面的构造函数代码来看,jQuery构造函数主要支持一下几种方式

 

 

1、$( Function ),ready函数

 

2、$( Element ) / $( [ Element] ),可以把Dom元素或者数组直接转换成jQuery对象

3、$( CSS Expression, Content), 也可以用CSS表达式来选取Dom元素

 

4、$( Html ),html也可以转换成jQuery对象

 

 


作者 baozhifei
补充:web前端 , JavaScript ,
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,