jQuery 1.1 と他のライブラリ(Prototype, YUI, MooToolsなど)を併用する方法

第三十五回

先日紹介した jQuery 1.1 では,HTML要素を選択するために$();を使っています.しかし,この関数は他の主要JavaScriptライブラリ*1でも同じように使われているので,複数のライブラリを同時に利用すると思わぬバグが出たりします.
jQuery 1.1 では,他のライブラリと同時利用しても大丈夫なように設計されているため,jQuery.noConflict();という一行を書き足すだけで他のライブラリと一緒に使えます.
以下では Prototype と一緒に使う例を示します.

 <html>
 <head>
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>  <!-- jQuery を後に読み込みます. -->
   <script>
     jQuery.noConflict();  // このスクリプト行を追加します.
     
     // jQuery を使うときは jQuery();
     // Prototype を使うときは $(); を使います.
   </script>
 </head>
 <body></body>
 </html>

また,$();の代わりにいちいちjQuery();と打つのがめんどくさいときは以下のように別のショートカットを指定することもできます.

 <html>
 <head>
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>  <!-- jQuery を後に読み込みます. -->
   <script>
     jQuery.noConflict();  // このスクリプト行を追加します.
     var j$ = jQuery;      // j$() を jQuery のショートカットにします.

     // jQuery を使うときは jQuery(); または j$();
     // Prototype を使うときは $(); を使います.
   </script>
 </head>
 <body></body>
 </html>

*1:Prototype, YUI, MooToolsなど