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的引用。

示例&说明

1、以下是加载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>

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

// 让出对变量$的控制权,并将jQuery赋给新的别名jvar j = jQuery.noConflict();

// 基于jQuery进行DOM操作(使用变量j)j("#uname").hide();

// 基于Prototype进行DOM操作$("myDiv").setStyle( {color: "#ffffff"} );

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

// 让出jQuery库对变量$的控制权jQuery.noConflict();

jQuery(document).ready(function($){    // 使用局部变量$进行jQuery操作    $("p").css("color", "");    });

(function($){    // 使用局部变量$进行jQuery操作    $("ul li").addClass("item");    }(jQuery));

4、如果要实现两个版本的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.2document.writeln( jQuery.fn.jquery ); // 1.4.2

/* * 如果前面的jQuery.noConflict()没有传入参数true, * 也就是说只让出变量$的控制,则$表示1.4.2,jQuery表示1.11.1 * 此时,jQuery.fn.jquery为1.11.1 */ </script>

5、三个版本的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.1document.writeln( jQuery.fn.jquery ); // 1.8.3document.writeln( $.fn.jquery ); // 1.4.2</script>

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

时间: 2024-10-11 09:47:45

jQuery.noConflict() 函数的相关文章

jQuery.noConflict() 函数详解

jQuery.noConflict()函数用于让出jQuery库对变量$(和变量jQuery)的控制权. 一般情况下,在jQuery库中,变量$是变量jQuery的别名,它们之间是等价的,例如jQuery("p")和$("p")是等价的.由于变量$只有一个字符,并且特点鲜明,因此我们更加习惯使用$来操作jQuery库. 不过,其他JS库也可能使用变量$来进行操作,例如Prototype库.这个时候两个库可能会由于变量$的控制权问题而发生冲突. 此时,你可以使用该函数

jQuery.noConflict() 解决冲突 原理深入

jQuery.noConflict()函数用于让出jQuery库对变量$(和变量jQuery)的控制权. 一般情况下,在jQuery库中,变量$是变量jQuery的别名,它们之间是等价的,例如jQuery("p")和$("p")是等价的.由于变量$只有一个字符,并且特点鲜明,因此我们更加习惯使用$来操作jQuery库. 不过,其他JS库也可能使用变量$来进行操作,例如Prototype库.这个时候两个库可能会由于变量$的控制权问题而发生冲突. 此时,你可以使用该函数

JQuery之JQuery的版本 JQuery入门 属性获取 JQuery就绪函数 JS文档就绪函数和JQuery文档就绪函数的区别 JS对象和JQuery对象的区别 关于$的使用 多个JS库的冲突解决方案

JQuery的版本 JQuery入门 属性获取 JQuery就绪函数 JS文档就绪函数和JQuery文档就绪函数的区别 JS对象和JQuery对象的区别 关于$的使用 多个JS库的冲突解决方案 JQuery的版本 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery的版本</title> <

jQuery - noConflict() 方法

jQuery - noConflict() 方法 如何在页面上同时使用 jQuery 和其他框架? jQuery 和其他 JavaScript 框架 正如您已经了解到的,jQuery 使用 $ 符号作为 jQuery 的简写. 如果其他 JavaScript 框架也使用 $ 符号作为简写怎么办? 其他一些 JavaScript 框架包括:MooTools.Backbone.Sammy.Cappuccino.Knockout.JavaScript MVC.Google Web Toolkit.Go

关于jquery.noConflict()的学习记录

今天无意中看到了jquery.noConfict()的实现方法 代码如下: var // Map over jQuery in case of overwrite _jQuery = window.jQuery, // Map over the $ in case of overwrite _$ = window.$; jQuery.noConflict = function( deep ) { if ( window.$ === jQuery ) { window.$ = _$; } if (

jquery.noConflict源码分析(2)

代码位于9159~9183 该功能是为了解决JQ与其他函数命名冲突的问题. API  jQuery.noConflict([removeAll]); 缺省情况下,运行这个函数将变量$的控制权让渡给第一个实现它的库.在运行完这个函数之后,就只能使用jQuery变量访问jQuery对象. 该函数必须在导入jQuery文件之后,并且在导入另一个导致冲突的库之前使用. var // Map over jQuery in case of overwrite _jQuery = window.jQuery,

jquery 常用函数一览

可以打印后慢慢一个一个查找,有利于记忆. 核心 ·         jQuery 核心函数 o    jQuery([sel,[context]]) o    jQuery(html,[ownerDoc])1.8* o    jQuery(callback) o    jQuery.holdReady(hold)1.6+ ·         jQuery 对象访问 o    each(callback) o    size() o    length o    selector o    con

jQuery 核心函数 (十一)

函数 描述 jQuery() 接受一个字符串,其中包含了用于匹配元素集合的 CSS 选择器. jQuery.noConflict() 运行这个函数将变量 $ 的控制权让渡给第一个实现它的那个库.

JQuery事件函数

$("button").click(function(){ $("p").hide(); });如果您的网站包含许多页面,并且您希望您的 jQuery 函数易于维护,那么请把您的 jQuery 函数放到独立的 .js 文件中.页面引用时放到head标签里 <head> <script type="text/javascript" src="jquery.js"></script> <s