jQuery.noConflict() 函数详解

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