与其他库一起使用jQuery-控件新闻-慧都网

与其他库一起使用jQuery

翻译|其它|编辑：郝浩|2007-09-03 13:47:34.000|阅读 1118 次

概述：

　　概要：
　　在 jQuery 库，几乎所有的 jQuery 插件都被约束在它的命名空间里，通常，“global”对象同样被存储在 jQuery 命名空间里，因些不会使它与其它库（如：Prototype, MooTools, or YUI）发生冲突。
　　注意，jQuery 用"$"作为它自身的默认快捷方式。

　　"$"的功能：
　　当 jQuery 与其它库被加载后，你也可以不顾它的默认快捷方式而在任意一处通过调用 jQuery.noConflict()函数来指定使用 jQuery 库，例如：

代码

1. <html>

2. <head>

3. <script src="prototype.js"></script>

4. <script src="jquery.js"></script>

5. <script>

6. jQuery.noConflict();

8. // Use jQuery via jQuery(...)

9. jQuery(document).ready(function(){

10. jQuery("div").hide();

11. });

12.

13. // Use Prototype with $(...), etc.

14. $('someid').style.display = 'none';

15. </script>

16. </head>

17. <body></body>

18. </html>

　　这将使$回到它的原始库里，你依然可以在其它的应用程序里使用"jQuery"。
　　另外，还有其它选项。如果你想确定 jQuery 不会与其它库冲突——但你又想自定义一个比较短快捷方式，你可以这么做：

代码

1. <html>

2. <head>

3. <script src="prototype.js"></script>

4. <script src="jquery.js"></script>

5. <script>

6. var $j = jQuery.noConflict();

8. // Use jQuery via $j(...)

9. $j(document).ready(function(){

10. $j("div").hide();

11. });

12.

13. // Use Prototype with $(...), etc.

14. $('someid').style.display = 'none';

15. </script>

16. </head>

17. <body></body>

18. </html>

　　你能够自定义你自己的备用名称（如：jq、$J、awesomequery——可以是任何你想要的）。
　　如果你不想给 jQuery 自定义其它备用名称（你更愿意使用$而不管其它库的$方法）而又不想与其它库相冲突时，以下的解决方法最常使用的。

代码

1. <html>

2. <head>

3. <script src="prototype.js"></script>

4. <script src="jquery.js"></script>

5. <script>

6. jQuery.noConflict();

8. // Put all your code in your document ready area

9. jQuery(document).ready(function($){

10. // Do jQuery stuff using $

11. $("div").hide();

12. });

13.

14. // Use Prototype with $(...), etc.

15. $('someid').style.display = 'none';

16. </script>

17. </head>

18. <body></body>

19. </html>

　　对于你的大部分代码而言，这或许是最理想的方式，因为你可以以改变最少的代码来实现完全的兼容性。

　　参考：适合 jQuery 的快捷表示方式
　　如果你不喜欢总是键入完整的"jQuery"，有一些可供替换的快捷方式：
　　重新指定 jQuery 为其它快捷方式

代码

1. var $j = jQuery;

　　如果你想使用其它不同的库，这或许是最好的方法。
　　使用下列方法，可以指定在一块代码内使用"$"：

代码

1. function($) { // some code that uses $ })(jQuery)

　　备注：如果你使用了这种方法，在这块代码中你将不能使用"$"来调用 Prototype 方法，因为你选择了在这块代码中唯一使用 jQuery 方法。
　　使用以下方法来实现 DOM ready event:

代码

1. jQuery(function($) { // some code that uses $ });

　　备注：同样，在这个代码块里你也还有调用 Prototype 方法。

标签：

本站文章除注明转载外，均为本站原创或翻译。欢迎任何形式的转载，但请务必注明出处、不得修改原文相关链接，如果存在内容上的异议请邮件反馈至chenjj@evget.com

文章转载自：JavaEye

上一篇：Ajax与XMLHttpRequest对象下一篇：javascript反射机制

在线采购

中文文档库

试用/Demo下载

开发社群