文章集合

投稿送独立广告位 投稿QQ群:691739191

当前位置:首页>文章集合

两个js冲突怎么解决?试试这四个方法

: 腾讯云    : 2021-03-07 03:44    : 122    : 技术教程   

 两个js冲突很让前端头疼,虽然jquery是通用的,但调用不同经常会出问题。jQuery是目前流行的JS封装包,简化了很多复杂的JS程序,JQuery讲浏览器DOM树定义为$,通过$来获取各个子节点。JS插件还有prototype.js 等,它们也算比较好的插件,也使用$。所以有时候同时使用这个两个JS插件的时候,就会出现$的使用权冲突问题。两个js冲突怎么解决?试试下面四个方法

  我们都知道JQuery有一个函数,jquery.noConflict() 它的作用是讲$的控制权转让出去。然后我们可以通过jQuery代替$来获取dom节点。

  方法一 

<script type="text/javascript">jQuery.noConflict(); //将变量$的控制权让渡给prototype.jsjQuery(function(){ //使用jQueryjQuery("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.jsjQuery(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>


反馈 | 责任编辑:二零网络工作室


文章页底部广告位

上一篇:在线分享Emlog2021年新版后台登录页面,可自适应移动端

下一篇:京东官方学生在线1元撸三只松鼠等

发表评论:

评论记录:

未查询到任何评论数据!