名客技术网

简体
繁体
×警告!请输入搜索关键词(仅提示一次)
网站建设电话:15927179345(资深程序)

关于jQuery库冲突的完美解决办法

作者:网站小编时间:2018-11-27 09:11:06


众所周知,jQuery是目前最流行的JS封装包,简化了很多复杂的JS程序,JQuery讲浏览器DOM树定义为,通过,通过来获取各个子节点。 
然后,JS插件并非只有JQuery,还有prototype.js 等其它比较好的插件。它们也使用。所以有时候同时使用这个两个JS插件的时候,就会出现。所以有时候同时使用这个两个JS插件的时候,就会出现的使用权冲突问题。现在我们来看看如何解决这个冲突问题。请看下文: 
我们都知道JQuery有一个函数,jquery.noConflict() 它的作用是讲的控制权转让出去。然后我们可以通过jQuery代替的控制权转让出去。然后我们可以通过jQuery代替来获取dom节点 
举例: 
方法一: 
代码如下:

<script type="text/javascript"> jQuery.noConflict(); //将变量$的控制权让渡给prototype.js jQuery(function(){ //使用jQuery jQuery("p").click(function(){ alert( jQuery(this).text() ); }); }); $("pp").style.display = 'none'; //使用prototype </script>

方法二: 
我们可以通过noConflict()函数来定义一个快捷方式用来获取dom节点 
代码如下:

<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>

还有其它的方法,都给大家列举出来,同理都可以看明白了吧,呵呵。 
方法三: 
代码如下:

<script type="text/javascript"> jQuery.noConflict(); //将变量$的控制权让渡给prototype.js jQuery(function($){ //使用jQuery $("p").click(function(){ //继续使用 $ 方法 alert( $(this).text() ); }); }); $("pp").style.display = 'none'; //使用prototype </script>

方法四: 
代码如下:

<script type="text/javascript"> jQuery.noConflict(); //将变量$的控制权让渡给prototype.js (function($){ //定义匿名函数并设置形参为$ $(function(){ //匿名函数内部的$均为jQuery $("p").click(function(){ //继续使用 $ 方法 alert($(this).text()); }); }); })(jQuery); //执行匿名函数且传递实参jQuery $("pp").style.display = 'none'; //使用prototype </script>
名客技术网如果无意之中侵犯了您的版权,请联系站长,本站将在3个工作日内删除 QQ:175352796
Copyright 2011-2020 Powered by 121ASK.COM, All Rights Reserved.
备案号:鄂ICP备11013833号-3