请知悉:本文最近一次更新为 9年 前,文中内容可能已经过时。

昨天写了Discuz!中的common.js和jQuery.js冲突的问题。更深入的说明一下:
在jQuery中,$是jQuery的别名,所有使用$的地方也都可以使用jQuery来替换,如$('#msg')等同于jQuery('#msg')的写法。然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突。

这个时候,在jQuery.js尾部添加的jQuery.noConflict();,就表示jQuery放弃对$的所有权。这样就避免了冲突。

既然可以放弃$的所有权,那说明可以自定义引用的方式或者说是别名。

下面的代码即将jQuery的别名定义为$jq。

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

除此之外,还可以使用语句块来使用jQuery.js中定义的$,代码如下:

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

或者

(function($){ 
.....
$('#msg').hide();//此时在这个语句块中使用的都是jQuery.js中定义的$.
})(jQuery)

如果在第二种引入js库文件顺序的情况下,如何使用jQuery.js中的$,我们还是可以使用上面介绍的语句块的方法,如:

<script src="jQuery.js" type="text/JavaScript"/> 
<script src="prototype.js" type="text/JavaScript"/>
<script type="text/JavaScript">
(function($){
.....
$('#msg').hide();//此时在这个语句块中使用的都是jQuery.js中定义的$.
})(JQuery)
</script>

这种使用语句块的方法非常有用,在我们自己写jQuery插件时,应该都使用这种写法,因为我们不知道具体工作过程中是如何顺序引入各种js库的,而这种语句块的写法却能屏蔽冲突。

以上内容整理修改自:https://www.cnblogs.com/RascallySnake/archive/2010/05/07/1729417.html


如您从本文得到了有价值的信息或帮助,请考虑扫描文末二维码捐赠和鼓励。

尊重他人劳动成果。转载请务必附上原文链接,我将感激不尽。


与《jQuery-$冲突-别名释义》相关的博文:


留言

avatar
😀
😀😁😂😅😭🤭😋😘🤔😰😱🤪💪👍👎🤝🌹👌