文档章节

jQuery.noConflict() 函数详解

鱼煎
 鱼煎
发布于 2015/07/20 23:17
字数 939
阅读 233
收藏 5

jQuery.noConflict()函数用于让出jQuery库对变量$(和变量jQuery)的控制权

一般情况下,在jQuery库中,变量$是变量jQuery的别名,它们之间是等价的,例如jQuery("p")和$("p")是等价的。由于变量$只有一个字符,并且特点鲜明,因此我们更加习惯使用$来操作jQuery库。

不过,其他JS库也可能使用变量$来进行操作,例如Prototype库。这个时候两个库可能会由于变量$的控制权问题而发生冲突。

此时,你可以使用该函数让出jQuery库对变量$的控制权,将该变量交给上一个实现它的JS库,之后我们只能使用变量jQuery来操作jQuery库。

此外,使用该函数,还可以同时让出变量$和变量jQuery的控制权,从而实现多个不同版本的jQuery库共存(详情见下面的示例说明)。

该函数属于全局jQuery对象。

语法

静态函数jQuery.noConflict()的语法如下:

jQuery.noConflict( [ removeAll ] )

参数

参数 描述
removeAll 可选/Boolean类型是否彻底移交对变量jQuery的控制权,默认为false。

如果省略了参数removeAll或该参数不为true,则表示只让出对变量$的控制权;如果该参数为true,则表示同时让出变量$和jQuery的控制权。

返回值

jQuery.noConflict()函数的返回值是jQuery类型,返回变量jQuery的引用。

示例&说明

以下是加载Prototype和jQuery库的情况:

<script type="text/javascript" src="prototype.js"></script> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> // 让出对变量$的控制权 jQuery.noConflict(); // 使用jQuery进行DOM操作 jQuery("#uname").hide(); // 使用Prototype进行DOM操作 $("myDiv").setStyle( {color: "#ffffff"} ); </script>

运行代码 (以下代码请自行复制到演示页面运行,注意不要同时执行,请分别执行)

此外,我们还可以使用其他自定义的变量名来操作jQuery:

// 让出对变量$的控制权,并将jQuery赋给新的别名j var j = jQuery.noConflict(); // 基于jQuery进行DOM操作(使用变量j) j("#uname").hide(); // 基于Prototype进行DOM操作 $("myDiv").setStyle( {color: "#ffffff"} );

即使是多个库共存,我们也可以在jQuery.ready()的回调函数或其他自定义函数中将局部变量$作为jQuery的别名使用:

// 让出jQuery库对变量$的控制权 jQuery.noConflict(); jQuery(document).ready(function($){     // 使用局部变量$进行jQuery操作     $("p").css("color", "");     }); (function($){     // 使用局部变量$进行jQuery操作     $("ul li").addClass("item");     }(jQuery));

如果要实现两个版本的jQuery库共存,我们可以编写如下代码:

<script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="jquery-1.11.1.js"></script> <script type="text/javascript"> // 让出jQuery-1.11.1对变量$和变量jQuery的控制权 var j = jQuery.noConflict( true ); document.writeln( j.fn.jquery ); // 1.11.1 document.writeln( $.fn.jquery ); // 1.4.2 document.writeln( jQuery.fn.jquery ); // 1.4.2 /*  * 如果前面的jQuery.noConflict()没有传入参数true,  * 也就是说只让出变量$的控制,则$表示1.4.2,jQuery表示1.11.1  * 此时,jQuery.fn.jquery为1.11.1  */  </script>

三个版本的jQuery库共存,对应的jQuery示例代码如下:

<script type="text/javascript" src="jquery-1.4.2.js"></script> <script type="text/javascript" src="jquery-1.8.3.js"></script> <script type="text/javascript" src="jquery-1.11.1.js"></script> <script type="text/javascript"> // 让出jQuery-1.11.1对变量$和变量jQuery的控制权,使用变量j来控制 var j = jQuery.noConflict( true ); // 让出jQuery-1.8.3对变量$的控制权 jQuery.noConflict(); document.writeln( j.fn.jquery ); // 1.11.1 document.writeln( jQuery.fn.jquery ); // 1.8.3 document.writeln( $.fn.jquery ); // 1.4.2 </script>

注意:多个可能存在全局变量重名冲突的JS库,变量的实际控制权一般取决于JS库的加载顺序。以上面三个版本的jQuery库的示例代码为例,后加载的jQuery库的变量覆盖了之前版本的变量,因此每次让出变量的控制权,控制权就会交给上一个JS库。

本文转载自:

鱼煎
粉丝 19
博文 230
码字总数 41483
作品 0
深圳
技术主管
私信 提问
Discuz jQuery 冲突

$(id)函数冲突Discuz使用了S()作为对象选取函数,刚好与jQuery默认的$()函数重合造成冲突,代码依旧位于include/common.js中,如下: Code:function $(id) {return document.getElementById(...

Jack088
2016/07/04
19
0
两个jQuery冲突了怎么办

本篇文章主要是对JQuery的$和其它JS发生冲突的快速解决方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 众所周知,jQuery是目前最流行的JS封装包,简化了很多复杂的JS程序,J...

刘宗阳博客
2016/11/08
59
0
解决jQuery和其它库的冲突

在jQuery库中,几乎所有的插件都被限制在它的命名空间里。全局的对象都很好地存储在jQuery命名空间里,因此当把jQuery和其它javascript类库一起使用时,不会引起冲突.(注意:默认情况下,jQu...

Junn
2013/01/21
252
0
Jquery不同版本共用的解决方案(插件编写)

最近在为某公司做企业内部UI库,经过研究分析和评审,决定基于Jquery开发,结合Bootstrap插件那简洁,优雅,高效的思想进行插件编写。 但是在编写的过程中遇到一个头疼的问题,就是正在编写的...

Eric_HSBC
2013/05/15
3.7K
2
(function($){...})(jQuery)的意思

这里实际上是匿名函数 function(arg){...} 这就定义了一个匿名函数,参数为arg 而调用函数时,是在函数后面写上括号和实参的,由于操作符的优先级,函数本身也需要用括号,即: (function(ar...

hhhhfengxing
2013/12/23
59
0

没有更多内容

加载失败,请刷新页面

加载更多

32位与64位Linux系统下各类型长度对比

64 位的优点:64 位的应用程序可以直接访问 4EB 的内存和文件大小最大达到4 EB(2 的 63 次幂);可以访问大型数据库。本文介绍的是64位下C语言开发程序注意事项。 1. 32 位和 64 位C数据类型...

mskk
24分钟前
6
0
Vue 实现点击空白处隐藏某节点(三种方式:指令、普通、遮罩)

在项目中往往会有这样的需求: 弹出框(或Popover)在 show 后,点击空白处可以将其 hide。 针对此需求,整理了三种实现方式,大家按实际情况选择。 当然,我们做项目肯定会用到 UI 框架,常...

张兴华ZHero
31分钟前
7
0
SpringBoot激活profiles你知道几种方式?

多环境是最常见的配置隔离方式之一,可以根据不同的运行环境提供不同的配置信息来应对不同的业务场景,在SpringBoot内支持了多种配置隔离的方式,可以激活单个或者多个配置文件。 激活Profi...

恒宇少年
32分钟前
7
0
PDF修改文字的方法有哪些?怎么修改PDF文件中的文字

PDF修改文字一直以来都是一个难以解决的问题,很多的办公族在办公的时候会有修改PDF文件中的文字的需要,可是PDF文件一般是不能进行编辑和修改的,难道就没有什么办法解决这个问题了嘛?不要...

趣味办公社
35分钟前
5
0
企业组织中采用服务网格的挑战

作者:Christian Posta 译者:罗广明 原文:https://blog.christianposta.com/challenges-of-adopting-service-mesh-in-enterprise-organizations/ 编者按 本文作者介绍了企业组织采用服务网...

jimmysong
45分钟前
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部