您好,登錄后才能下訂單哦!
jQuery核心函數除了最重要的jQuery()之外,還有jQuery.holdReady()、jQuery.sub()、jQuery.when()、jQuery.noConflict()。今天我就介紹一下這四個方法吧。
首先是jQuery.holdReady(),直接上代碼:
holdReady: function( hold ) { if ( hold ) { jQuery.readyWait++; // readyWait就是一個計數器,表示還有多少個條目就緒事件才能執行
} else { jQuery.ready( true ); } }
使用方法如下:
jQuery.holdReady( hold )
作用:暫停或恢復.ready() 事件的執行
參數:hold為boolean值,指示是否暫停或恢復被請求的ready事件
jQuery.holdReady()方法允許jQuery的完成事件被該函數鎖定。這個高級特性的典型應用場合是動態載入腳本,比如jQuery插件等。在附加的腳本載入完成前,即使頁面已經準備好,jQuery的完成事件也不會被觸發。這個函數必須在頁面的靠前部分被調用,比如在<head>標簽當中,jQuery載入下一行。在完成事件被觸發后調用此函數沒有任何效果。使用方法:首先調用$.holdReady(true)[調用后完成事件將被鎖定]。當準備好觸發完成事件時,調用$.holdReady(false)。需要注意的是,可以對完成事件添加多個鎖定,每個鎖定對應一次$.holdReady(false)[解鎖]調用。jQuery的完成事件將在所有的鎖定都被解除,并且頁面也已經準備好的情況下被觸發。實際上就是為一些需要依賴動態腳本的代碼加的一個安全鎖,當所需要的動態腳本加載完畢后再執行就緒事件,而不是在DOM樹構建成功后執行。
這里面又涉及到了jQuery.ready()方法:
ready: function( wait ) { // 如果還有等待的事件的話就取消執行,直接返回 if ( wait === true ? --jQuery.readyWait : jQuery.isReady ) { return; } // 確定文檔的body已經存在,延遲執行是為了防止IE“抽風” if ( !document.body ) { return setTimeout( jQuery.ready, 1 ); } // isReady屬性用來表示DOM樹是否可用 jQuery.isReady = true; // 如果正常的ready事件觸發, 減少等待的數目,然后繼續等待 if ( wait !== true && --jQuery.readyWait > 0 ) { return; } readyList.resolveWith( document, [ jQuery ] ); // Trigger any bound ready events if ( jQuery.fn.trigger ) { jQuery( document ).trigger("ready").off("ready"); } }
請注意,這里的jQuery.ready()和jQuery(document).ready()是不一樣的。
接著分析jQuery.sub()方法。該方法不接收參數,它的作用就是復制一份jQuery副本,并且不影響原來的jQuery對象:
jQuery.sub = function() { function jQuerySub( selector, context ) { return new jQuerySub.fn.init( selector, context ); } jQuery.extend( true, jQuerySub, this ); jQuerySub.superclass = this; jQuerySub.fn = jQuerySub.prototype = this(); jQuerySub.fn.constructor = jQuerySub; jQuerySub.sub = this.sub; jQuerySub.fn.init = function init( selector, context ) { if ( context && context instanceof jQuery && !(context instanceof jQuerySub) ) { context = jQuerySub( context ); } return jQuery.fn.init.call( this, selector, context, rootjQuerySub ); }; jQuerySub.fn.init.prototype = jQuerySub.fn; var rootjQuerySub = jQuerySub(document); return jQuerySub; };
jQuery.sub這個方法主要用于兩類特殊的情況,第一種情況是在不用污染jQuery對象原生方法的情況下提供一種干凈的方式去覆蓋擴展jQuery對象,另一種情況是幫助開發者封裝和為jQuery插件構建一個命名空間。有了這個方法以后,就可以在混沌的jQuery插件世界里構建一個完全只屬于自己的插件模塊而不用擔心自己模塊會被污染或者自己的插件會和別的插件有沖突,但是同時也有幾點需要注意,sub對象中所有的方法都指向原生的jQuery對象,也意味著事件的綁定和派發以及綁定在elments中的data項仍然需要經過全局的jQuery對象,此外還有ajax等。仔細看該方法的內部實現,很像縮小版的jQuery對象創建過程。它首先初始化一個新的function對象用于copy原生jQuery對象,接著借助原型鏈為sub對象copy原生對象的方法,再然后 產生新的document的上下文rootjQuerySub,最后在新的jQuerySub內部初始化方法中調用原生的init方法進行初始化,和jQuery原版對象的創建流程基本上一樣!
還有倆,加油。jQuery.when()方法可接受一個或多個參數,該方法提供了一種方法來執行一個或多個參數延遲對象的回調函數,參數延遲對象通常表示異步事件:
when: function( subordinate /* , ..., subordinateN */ ) { var i = 0, resolveValues = core_slice.call( arguments ), length = resolveValues.length, // the count of uncompleted subordinates remaining = length !== 1 || ( subordinate && jQuery.isFunction( subordinate.promise ) ) ? length : 0, // the master Deferred. If resolveValues consist of only a single Deferred, just use that. deferred = remaining === 1 ? subordinate : jQuery.Deferred(), // Update function for both resolve and progress values updateFunc = function( i, contexts, values ) { return function( value ) { contexts[ i ] = this; values[ i ] = arguments.length > 1 ? core_slice.call( arguments ) : value; if( values === progressValues ) { deferred.notifyWith( contexts, values ); } else if ( !( --remaining ) ) { deferred.resolveWith( contexts, values ); } }; }, progressValues, progressContexts, resolveContexts; // add listeners to Deferred subordinates; treat others as resolved if ( length > 1 ) { progressValues = new Array( length ); progressContexts = new Array( length ); resolveContexts = new Array( length ); for ( ; i < length; i++ ) { if ( resolveValues[ i ] && jQuery.isFunction( resolveValues[ i ].promise ) ) { resolveValues[ i ].promise() .done( updateFunc( i, resolveContexts, resolveValues ) ) .fail( deferred.reject ) .progress( updateFunc( i, progressContexts, progressValues ) ); } else { --remaining; } } } // if we're not waiting on anything, resolve the master if ( !remaining ) { deferred.resolveWith( resolveContexts, resolveValues ); } return deferred.promise(); }
這段代碼我也看得似懂非懂,所以具體的分析我就不寫了,如果你想深入了解的話參考:http://cmc3.cn/n/249.html和http://nuysoft.iteye.com/blog/1174798
最后一個方法,jQuery.noConflict(),用于解決命名沖突的問題。該方法接受一個可選的boolean參數,如果該參數=true,則將全局變量$和全局變量jQuery的控制權全部讓出;如果沒有參數或者該參數=false,則只將全局變量$的控制權讓出。
注:如果將全局變量jQuery的控制權也讓出,我們必須考慮到大多數插件依靠jQuery存在的變量,這種情況,可能不能正常操作。
noConflict: function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; } if ( deep && window.jQuery === jQuery ) { window.jQuery = _jQuery; } return jQuery; }
代碼就不解釋了,是個人就能看懂,今天就寫到這吧。
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。