jQuery与$冲突问题

淡淡的烟草味﹌ 2023-03-14 10:49 8阅读 0赞

**Jquery的$ 命名冲突**

*  在Jquery中，$ 是JQuery的别名，所有使用 $ 的地方也都可以使用JQuery来替换，如 $ ("\#msg")等同于JQuery("\#msg") 的写法。然而，当我们引入多个js库后，在另外一个js库中也定义了$ 符号的话，那么我们在使用$符号时就发生了冲突。

**原生js和jQuery加载模式不同**

1.  原生js会等DOM加载完成，图片等资源也加载完成再执行；
2.  jQuery会等DOM加载完成，但不会等图片等资源加载完成就会执行。

**多个入口函数**

window.onload = function(e){
    	console.log("hello1");
    }
    window.onload = function(e){
    	console.log("hello2");
    }

**jQuery的入口函数如果编写了多个，后面写的不会覆盖前面的**

$(document).ready(function(){
    	console.log("hello1");
    })
    $(document).ready(function(){
    	console.log("hello2");
    })

## jQuery冲突问题解决方式： ##

**一.使用JQuery.noConflict()**  
该方法的作用就是让Jquery放弃对 $ 的所有权， 将 $的控制权交还给prototype.js,因为jquery.js是后引入的，所以最后拥有 $ 控制权的是jquery。它的返回值是JQuery。当 在代码中调用了该 方法以后，我们就不可以使用 $ 来调用jquery的方法了，此时 $ 就代表在prototype.js库中定义的 $了。

JQuery.noConflict();

**二.自定义JQuery的别名**  
如果觉得第一种方法中使用了JQuery.noConflict()方法以后,只能使用JQuery全称比较麻烦的话，我们还可以为JQuery重定义别名。

var $str=JQuery.noConflict();
    $str('#msg').hide();   //  此处$str就代表JQuery

**三.使用语句块，在语句块中仍然使用jquery.js中定义的$**

jQuery.noConflict();
    jQuery(document).ready(function($){
    $('#msg').hide();  // 此时在整个ready事件的方法中使用的$都是jquery.js中定义的$.
    });

**如果引入了多个框架，并其他框架也引入了$的冲突解决办法：**

1.  释放$的使用权；
2.  自定义一个访问符号。