国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 編程 > JavaScript > 正文

jQuery中noConflict()用法實例分析

2019-11-20 13:12:20
字體:
來源:轉載
供稿:網友

本文實例講述了jQuery中noConflict()用法。分享給大家供大家參考。具體分析如下:

jQuery默認使用"$"操作符,$ 符號只是 window.jQuery 對象的一個引用,jQuery.noConflict() ,這個函數將變量$的控制權讓渡給第一個實現它的那個庫。這有助于確保jQuery不會與其他庫的$對象發生沖突。在運行這個函數后,就只能使用jQuery變量訪問jQuery對象。例如,在要用到$("div p")的地方,就必須換成jQuery("div p")。

一、"$"操作符

1、jQuery默認使用"$"操作符,prototype等其他框架也是是使用"$",于是,如果jQuery在其他庫之后引入,那么jQuery將獲得"$"使用權。這樣的情況也很容易理解,畢竟JS是從上到下流式執行的。

2、如果在其他使用"$"的庫之前引入jQuery,那么jQuery將不會占用"$"。

提示:在其他 JavaScript 庫為其函數使用 $ 時,該方法很有用。

我們在jquery中獲取變量都會使用到$,但是還有很多插件都是可以使用$這個符號了,如果我們同時要引用就會導致出現問題了,jquery為了防止這種事情發生就引入了noconflict()

二、jQuery.noConflict的定義
 
jQuery.noConflict 方法包含一個可選的布爾參數,用以決定移交 $ 引用的同時是否移交 jQuery 對象本身:

jQuery.noConflict([removeAll])

函數的說明:

缺省情況下,執行 noConflict 會將變量 $ 的控制權移交給第一個產生 $ 的庫;當 removeAll 設置為 true 時,執行 noConflict 則會將 $ 和 jQuery 對象本身的控制權全部移交給第一個產生他們的庫。
 
三、jQuery.noConflict源碼分析
 
jQuery 源碼開頭,首先做的一件事情是這樣的:

// Map over jQuery in case of overwrite_jQuery = window.jQuery,// Map over the $ in case of overwrite_$ = window.$,

容易理解的是,jQuery 通過兩個私有變量映射了 window 環境下的 jQuery 和 $ 兩個對象,以防止變量被強行覆蓋。一旦 noConflict 方法被調用,則通過 _jQuery, _$, jQuery, $ 四者之間的差異,來決定控制權的移交方式,具體的代碼如下:

noConflict: function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; } if ( deep && window.jQuery === jQuery ) { window.jQuery = _jQuery; } return jQuery;}

再來看上面所說的參數設定問題,如果 deep 沒有設置,_$ 覆蓋 window.$,此時 jQuery 別名 $ 失效,但 jQuery 本身完好無損。如果有其他類庫或代碼重新定義了 $ 變量,它的控制權就完全交接出去了。反之如果 deep 設置為 true 的話,_jQuery 覆蓋 window.jQuery,此時 $ 和 jQuery 都將失效。
這種操作的好處是,不管是框架混用還是 jQuery 多版本共存這種高度沖突的執行環境,由于 noConflict 方法提供的移交機制,以及本身返回未被覆蓋的 jQuery 對象,完全能夠通過變量映射的方式解決沖突。

四、jQuery.noConflict實例
 
1、將 $ 引用的對象映射回原始的對象:

jQuery.noConflict();jQuery("div p").hide(); // 使用 jQuery$("content").style.display = "none"; // 使用其他庫的 $() 

2、恢復使用別名 $,然后創建并執行一個函數,在這個函數的作用域中仍然將 $ 作為 jQuery 的別名來使用。在這個函數中,原來的 $ 對象是無效的。這個函數對于大多數不依賴于其他庫的插件都十分有效:

jQuery.noConflict();(function($) {  $(function() {  // 使用 $ 作為 jQuery 別名的代碼 });})(jQuery);... // 其他用 $ 作為別名的庫的代碼

3、可以將 jQuery.noConflict() 與簡寫的 ready 結合,使代碼更緊湊:

jQuery.noConflict()(function(){  // 使用 jQuery 的代碼});... // 其他庫使用 $ 做別名的代碼

4、創建一個新的別名用以在接下來的庫中使用 jQuery 對象:

var j = jQuery.noConflict();j("div p").hide();  // 基于 jQuery 的代碼$("content").style.display = "none";// 基于其他庫的 $() 代碼

5、完全將 jQuery 移到一個新的命名空間:

var dom = {};dom.query = jQuery.noConflict(true);//結果:dom.query("div p").hide();  // 新 jQuery 的代碼$("content").style.display = "none";  // 另一個庫 $() 的代碼jQuery("div > p").hide();  // 另一個版本 jQuery 的代碼

希望本文所述對大家的jQuery程序設計有所幫助。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 邵东县| 阜新市| 云浮市| 茌平县| 达拉特旗| 来宾市| 甘南县| 界首市| 厦门市| 平凉市| 弥勒县| 东乡县| 兰西县| 榆中县| 汝阳县| 达拉特旗| 五家渠市| 余干县| 丹寨县| 锡林郭勒盟| 广丰县| 山东省| 阳信县| 舞钢市| 孝昌县| 洛南县| 黄平县| 永川市| 上栗县| 龙游县| 扬州市| 游戏| 永仁县| 大英县| 元氏县| 秦皇岛市| 民县| 琼结县| 西藏| 灵寿县| 会宁县|