歡迎來到Linux教程網
Linux教程網
Linux教程網
Linux教程網
Linux教程網 >> Linux編程 >> Linux編程 >> 與其他庫一起使用jQuery

與其他庫一起使用jQuery

日期:2017/3/1 11:03:13   编辑:Linux編程

概要:
  在jQuery庫,幾乎所有的jQuery插件都被約束在它的命名空間裡,通常,“global”對象同樣被存儲在jQuery命名空間裡,因些不會使它與其它庫(如:Prototype, MooTools, or YUI)發生沖突。
  注意,jQuery用"$"作為它自身的默認快捷方式。
  
  "$"的功能:
  當jQuery與其它庫被加載後,你也可以不顧它的默認快捷方式而在任意一處通過調用jQuery.noConflict()函數來指定使用jQuery庫,例如:

Java代碼
  1. <html>
  2. <head>
  3. <script src="prototype.js"></script>
  4. <script src="jquery.js"></script>
  5. <script>
  6. jQuery.noConflict();
  7. // Use jQuery via jQuery(...)
  8. jQuery(document).ready(function(){
  9. jQuery("div").hide();
  10. });
  11. // Use Prototype with $(...), etc.
  12. $('someid').style.display = 'none';
  13. </script>
  14. </head>
  15. <body></body>
  16. </html>
 
  這將使$回到它的原始庫裡,你依然可以在其它的應用程序裡使用"jQuery"。
  另外,還有其它選項。如果你想確定jQuery不會與其它庫沖突——但你又想自定義一個比較短快捷方式,你可以這麼做: Java代碼
  1. <html>
  2. <head>
  3. <script src="prototype.js"></script>
  4. <script src="jquery.js"></script>
  5. <script>
  6. var $j = jQuery.noConflict();
  7. // Use jQuery via $j(...)
  8. $j(document).ready(function(){
  9. $j("div").hide();
  10. });
  11. // Use Prototype with $(...), etc.
  12. $('someid').style.display = 'none';
  13. </script>
  14. </head>
  15. <body></body>
  16. </html>
 

  你能夠自定義你自己的備用名稱(如:jq、$J、awesomequery——可以是任何你想要的)。
  如果你不想給jQuery自定義其它備用名稱(你更願意使用$而不管其它庫的$方法)而又不想與其它庫相沖突時,以下的解決方法最常使用的。 Java代碼
  1. <html>
  2. <head>
  3. <script src="prototype.js"></script>
  4. <script src="jquery.js"></script>
  5. <script>
  6. jQuery.noConflict();
  7. // Put all your code in your document ready area
  8. jQuery(document).ready(function($){
  9. // Do jQuery stuff using $
  10. $("div").hide();
  11. });
  12. // Use Prototype with $(...), etc.
  13. $('someid').style.display = 'none';
  14. </script>
  15. </head>
  16. <body></body>
  17. </html>
 

  對於你的大部分代碼而言,這或許是最理想的方式,因為你可以以改變最少的代碼來實現完全的兼容性。

  參考:適合jQuery的快捷表示方式
  如果你不喜歡總是鍵入完整的"jQuery",有一些可供替換的快捷方式:
  重新指定jQuery為其它快捷方式 Java代碼
  1. var $j = jQuery;
     
      如果你想使用其它不同的庫,這或許是最好的方法。
      使用下列方法,可以指定在一塊代碼內使用"$":
Java代碼 function($) { // some code that uses $ })(jQuery)
 
  備注:如果你使用了這種方法,在這塊代碼中你將不能使用"$"來調用Prototype方法,因為你選擇了在這塊代碼中唯一使用jQuery方法。
  使用以下方法來實現DOM ready event: Java代碼
  1. jQuery(function($) { // some code that uses $ });

備注:同樣,在這個代碼塊裡你也還有調用Prototype方法。

Copyright © Linux教程網 All Rights Reserved