概要:
在jQuery庫,幾乎所有的jQuery插件都被約束在它的命名空間裡,通常,“global”對象同樣被存儲在jQuery命名空間裡,因些不會使它與其它庫(如:Prototype, MooTools, or YUI)發生沖突。
注意,jQuery用"$"作為它自身的默認快捷方式。
"$"的功能:
當jQuery與其它庫被加載後,你也可以不顧它的默認快捷方式而在任意一處通過調用jQuery.noConflict()函數來指定使用jQuery庫,例如:
Java代碼
- <html>
- <head>
- <script src="prototype.js"></script>
- <script src="jquery.js"></script>
- <script>
- jQuery.noConflict();
-
- // Use jQuery via jQuery(...)
- jQuery(document).ready(function(){
- jQuery("div").hide();
- });
-
- // Use Prototype with $(...), etc.
- $('someid').style.display = 'none';
- </script>
- </head>
- <body></body>
- </html>
這將使$回到它的原始庫裡,你依然可以在其它的應用程序裡使用"jQuery"。
另外,還有其它選項。如果你想確定jQuery不會與其它庫沖突——但你又想自定義一個比較短快捷方式,你可以這麼做:
Java代碼
- <html>
- <head>
- <script src="prototype.js"></script>
- <script src="jquery.js"></script>
- <script>
- var $j = jQuery.noConflict();
-
- // Use jQuery via $j(...)
- $j(document).ready(function(){
- $j("div").hide();
- });
-
- // Use Prototype with $(...), etc.
- $('someid').style.display = 'none';
- </script>
- </head>
- <body></body>
- </html>
你能夠自定義你自己的備用名稱(如:jq、$J、awesomequery——可以是任何你想要的)。
如果你不想給jQuery自定義其它備用名稱(你更願意使用$而不管其它庫的$方法)而又不想與其它庫相沖突時,以下的解決方法最常使用的。
Java代碼
- <html>
- <head>
- <script src="prototype.js"></script>
- <script src="jquery.js"></script>
- <script>
- jQuery.noConflict();
-
- // Put all your code in your document ready area
- jQuery(document).ready(function($){
- // Do jQuery stuff using $
- $("div").hide();
- });
-
- // Use Prototype with $(...), etc.
- $('someid').style.display = 'none';
- </script>
- </head>
- <body></body>
- </html>
對於你的大部分代碼而言,這或許是最理想的方式,因為你可以以改變最少的代碼來實現完全的兼容性。
參考:適合jQuery的快捷表示方式
如果你不喜歡總是鍵入完整的"jQuery",有一些可供替換的快捷方式:
重新指定jQuery為其它快捷方式
Java代碼
- var $j = jQuery;
如果你想使用其它不同的庫,這或許是最好的方法。
使用下列方法,可以指定在一塊代碼內使用"$":
Java代碼
function($) { // some code that uses $ })(jQuery)
備注:如果你使用了這種方法,在這塊代碼中你將不能使用"$"來調用Prototype方法,因為你選擇了在這塊代碼中唯一使用jQuery方法。
使用以下方法來實現DOM ready event:
Java代碼
- jQuery(function($) { // some code that uses $ });
備注:同樣,在這個代碼塊裡你也還有調用Prototype方法。