jQueryとprototype.jsを同時に使うには

投稿日：2008 年 12 月 26 日

最近、JavaScriptのライブラリを使って動きを付けたりすることが多くなってきました。
特に多用するのが、ライブラリの代表格である「jQuery」と「prototype.js」の2つ。
ただ、どちらも「$」関数を使用しているため、これらのライブラリを同時に使うと正常に動作しません。

しかし、jQueryには他のライブラリと共存するための回避策が初めから用意されているのです。

すごいぞ、jQuery！

今回、参考にしたのは以下のサイトです。

で、いろいろ調べていろいろ考えた挙げ句、僕が実際に使ってる（使わせていただいている）のは以下のコードです。

<script><!--
jQuery.noConflict();
jQuery(document).ready(function($){
	// ここでは、$はjQueryとして使えます。
});
// ここでは、$はprototype.jsの動作をします。
//--></script>

他にも状況に応じていくつか方法があるみたいです。
が、「ほとんどの場合で問題なく動くであろう」ということと、「一番単純で簡潔っぽい」ということを理由に、上記を採用。

複数のサイトで導入しましたが、今のところちゃんと動いています。

jQuery.noConflict() は非常に便利なのですが、油断しているとこういうこと↓もあるみたいです。
jQuery.noConflictで罠 - masahilog

上記コードのように「$」を「jQuery」に置き換えてしまうと、「$」使用が前提のライブラリが動かなくなってしまう、ということですね。
当たり前っちゃ当たり前なんでしょうけど（でも事前に気づく自信なし）。

解決策としては、ライブラリ内も同じように「$」を「jQuery」に置き換えてしまうと大丈夫のようです。
実際そういう場面に直面したことがないので何とも言えないですが。

でもこの先いつかぶち当たってしまうそうなので、とりあえず備忘的メモ。

今回はいつにも増して「らしい」とか「みたい」が多いような気がします。

プログラミングもちゃんと勉強しないとだなぁ。