眾所周知,jQuery是目前最流行的JS封裝包,簡(jiǎn)化了很多復(fù)雜的JS程序,JQuery講瀏覽器DOM樹(shù)定義為$,通過(guò)$來(lái)獲取各個(gè)子節(jié)點(diǎn)。
然后,JS插件并非只有JQuery,還有prototype.js 等其它比較好的插件。它們也使用$。所以有時(shí)候同時(shí)使用這個(gè)兩個(gè)JS插件的時(shí)候,就會(huì)出現(xiàn)$的使用權(quán)沖突問(wèn)題。現(xiàn)在我們來(lái)看看如何解決這個(gè)沖突問(wèn)題。請(qǐng)看下文:
我們都知道JQuery有一個(gè)函數(shù),jquery.noConflict() 它的作用是講$的控制權(quán)轉(zhuǎn)讓出去。然后我們可以通過(guò)jQuery代替$來(lái)獲取dom節(jié)點(diǎn)
舉例:
方法一:
復(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>
我們可以通過(guò)noConflict()函數(shù)來(lái)定義一個(gè)快捷方式用來(lái)獲取dom節(jié)點(diǎn)
復(fù)制代碼 代碼如下:
<script type="text/javascript">
var $j = jQuery.noConflict(); //自定義一個(gè)比較短快捷方式
$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ù)且傳遞實(shí)參jQuery
$("pp").style.display = 'none'; //使用prototype
</script>
新聞熱點(diǎn)
疑難解答
圖片精選