快捷導(dǎo)航

JQuery的$和其它JS發(fā)生沖突的快速解決方法

更新時間：2014年01月24日 08:58:11 作者：

本篇文章主要是對JQuery的$和其它JS發(fā)生沖突的快速解決方法進行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助

眾所周知，jQuery是目前最流行的JS封裝包，簡化了很多復(fù)雜的JS程序，JQuery講瀏覽器DOM樹定義為$，通過$來獲取各個子節(jié)點。

然后，JS插件并非只有JQuery，還有prototype.js 等其它比較好的插件。它們也使用$。所以有時候同時使用這個兩個JS插件的時候，就會出現(xiàn)$的使用權(quán)沖突問題?，F(xiàn)在我們來看看如何解決這個沖突問題。請看下文：

我們都知道JQuery有一個函數(shù)，jquery.noConflict() 它的作用是講$的控制權(quán)轉(zhuǎn)讓出去。然后我們可以通過jQuery代替$來獲取dom節(jié)點

舉例：

方法一：

復(fù)制代碼代碼如下:

<script type="text/javascript">
jQuery.noConflict(); //將變量$的控制權(quán)讓渡給prototype.js
jQuery(function(){ //使用jQuery
jQuery("p").click(function(){
alert( jQuery(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script>

方法二：

我們可以通過noConflict()函數(shù)來定義一個快捷方式用來獲取dom節(jié)點

復(fù)制代碼代碼如下:

<script type="text/javascript">
var $j = jQuery.noConflict(); //自定義一個比較短快捷方式
$j(function(){ //使用jQuery
$j("p").click(function(){
alert( $j(this).text() );
});
});
$("pp").style.display = 'none'; //使用prototype
</script>

還有其它的方法，都給大家列舉出來，同理都可以看明白了吧，呵呵。

方法三：

復(fù)制代碼代碼如下:

<script type="text/javascript">
jQuery.noConflict(); //將變量$的控制權(quán)讓渡給prototype.js
jQuery(function($){ //使用jQuery
$("p").click(function(){ //繼續(xù)使用 $ 方法
alert( $(this).text() );
});
});  
$("pp").style.display = 'none'; //使用prototype
</script>

方法四：

復(fù)制代碼代碼如下:

<script type="text/javascript">
jQuery.noConflict(); //將變量$的控制權(quán)讓渡給prototype.js
(function($){ //定義匿名函數(shù)并設(shè)置形參為$
$(function(){ //匿名函數(shù)內(nèi)部的$均為jQuery
$("p").click(function(){ //繼續(xù)使用 $ 方法
alert($(this).text());
});
});
})(jQuery); //執(zhí)行匿名函數(shù)且傳遞實參jQuery
$("pp").style.display = 'none'; //使用prototype
</script>

您可能感興趣的文章: