JQuery的$和其它JS發(fā)生沖突的快速解決方法
眾所周知,jQuery是目前最流行的JS封裝包,簡化了很多復(fù)雜的JS程序,JQuery講瀏覽器DOM樹定義為$,通過$來獲取各個(gè)子節(jié)點(diǎn)。
然后,JS插件并非只有JQuery,還有prototype.js 等其它比較好的插件。它們也使用$。所以有時(shí)候同時(shí)使用這個(gè)兩個(gè)JS插件的時(shí)候,就會(huì)出現(xiàn)$的使用權(quán)沖突問題?,F(xiàn)在我們來看看如何解決這個(gè)沖突問題。請看下文:
我們都知道JQuery有一個(gè)函數(shù),jquery.noConflict() 它的作用是講$的控制權(quán)轉(zhuǎn)讓出去。然后我們可以通過jQuery代替$來獲取dom節(jié)點(diǎn)
舉例:
方法一:
<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ù)來定義一個(gè)快捷方式用來獲取dom節(jié)點(diǎn)
<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>
還有其它的方法,都給大家列舉出來,同理都可以看明白了吧,呵呵。
方法三:
<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>
方法四:
<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>
相關(guān)文章
JQuery實(shí)現(xiàn)動(dòng)態(tài)操作表格
本文主要分享了jQuery實(shí)現(xiàn)對一個(gè)表格動(dòng)態(tài)的添加行,刪除行,并且對表格中內(nèi)容進(jìn)行非空驗(yàn)證的示例代碼。具有很好的參考價(jià)值,下面跟著小編一起來看下吧2017-01-01jquery插件實(shí)現(xiàn)鼠標(biāo)隱藏
這篇文章主要為大家詳細(xì)介紹了jquery插件實(shí)現(xiàn)鼠標(biāo)隱藏,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2021-05-05jCallout 輕松實(shí)現(xiàn)氣泡提示功能
在提交表單前、焦點(diǎn)轉(zhuǎn)移后或者 keyup 時(shí)往往需要對輸入的文本就行檢驗(yàn),如果輸入內(nèi)容不符合相關(guān)約定則要進(jìn)行提示或警告,有一個(gè)叫 jCallout 的插件可以輕松實(shí)現(xiàn)該功能,該插件基于 jQuery 使用,所以使用前需要添加引用 jQuery2013-09-09詳解Jquery 遍歷數(shù)組之$().each方法與$.each()方法介紹
這篇文章主要介紹了詳解Jquery 遍歷數(shù)組之$().each方法與$.each()方法介紹 ,具有一定的參考價(jià)值,有興趣的可以了解一下。2017-01-01jquery怎樣實(shí)現(xiàn)ajax聯(lián)動(dòng)框(一)
ajax聯(lián)動(dòng)框想必大家早有所耳聞,接下來本文詳細(xì)介紹下使用jquery實(shí)現(xiàn)的原理及代碼,感興趣的你可以參考下,或許對你有所幫助2013-03-03使用jQuery+EasyUI實(shí)現(xiàn)CheckBoxTree的級聯(lián)選中特效
這篇文章主要介紹了使用jQuery+EasyUI實(shí)現(xiàn)CheckBoxTree的級聯(lián)選中特效的相關(guān)資料,需要的朋友可以參考下2015-12-12bootstrap與Jquery UI 按鈕樣式?jīng)_突的解決辦法
這篇文章主要介紹了bootstrap與Jquery UI 按鈕樣式?jīng)_突的解決辦法的相關(guān)資料,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友可以參考下2016-09-09jquery與js實(shí)現(xiàn)全選功能的區(qū)別
這篇文章主要介紹了jquery與js實(shí)現(xiàn)全選功能的區(qū)別,需要的朋友可以參考下2017-06-06