前些天朋友讓我幫他解決一個頁面中jquery特效的兼容性問題，覺得這是一個很容易忽略也很重要的一點，特在此記錄一下。
朋友給的頁面中用到了三個特效，其中兩個特效可以顯示，第三個沒有效果。通過查看引用的js文件，我發現頁面中不光引入了jquery.js，還引入了一個名為prototype.js的文件。 這個prototype.js之前未曾聽說過，特意在百度上搜了一下，原來它也是一個js類庫，功能和jquery差不多，而且很強大。
通過一點點的排查，我發現那兩個可以顯示的特效引用的是jquery,而不顯示的那個特效引用的是這個prototype.js。 稍一分析，終於找到了出錯的關鍵：jquery中的$和prototype.js中的$沖突了，兩個類庫中都是通過$符號來調用，然而如果直接這樣寫的話就會不知道這個$是屬於誰的，該調用哪個類庫中的方法來實現特效的顯示。
既然找到了問題的根結所在，那這個問題也就好解決了。
方法一：在jquery中，有這樣一段代碼：
// Expose jQuery to the global object window.jQuery = window.$ = jQuery;
也就是說，我們可以通過jQuery來代替jquery.js中的$符號進行調用，前提必須聲明一下：
jQuery = $;
那，新的問題又出現了。頁面中有那麼多地方用到了$,我不僅要區分到底哪些$是屬於jquery的，還要將這些$替換成jQuery這個單詞，更嚴重的是，如果該頁面中要增加新的jquery特效，我還要時刻的提醒自己，調用$的時候要用jQuery來代替，稍一疏忽，不僅出不來想要的效果，而且修改起來也是一個大工作量的任務。看來，這種方法是行不通的。
難道就沒有一個一勞永逸的方法可以將這個$的"歸屬權"給明確的區分出來嗎？辦法當然是有的！
方法二：使用jquery語句塊來實現：
首先，來看一下jquery語句塊的格式：
(function($){
.....
$('#msg').show();//此時在這個語句塊中使用的都是jquery.js中定義的$.
})(JQuery)
這樣，我們在調用jquery中的$實現特效顯示時，只要把這段代碼寫在這個語句塊中，$符號該怎麼調用還怎麼調用。而prototype.js中的$寫在語句塊外，$符號也是該怎麼調用怎麼調用，兩者根本不會產生什麼影響了。