jQuery 中的防冲突(noConflict)机制
许多的 JS 框架类库都选择使用 $ 符号作为函数或变量名,jQuery 是其中最为典型的一个。在 jQuery 中,$ 符号只是 window.jQuery 对象的一个引用,因此即使 $ 被删除,window.jQuery 依然是保证整个类库完整性的坚强后盾。jQuery 的 API 设计充分考虑了多框架之间的引用冲突,我们可以使用 jQuery.noConflict 方法来轻松实现控制权的移交。
jQuery.noConflict 方法包含一个可选的布尔参数[1],用以决定移交 $ 引用的同时是否移交 jQuery 对象本身:
jQuery.noConflict([removeAll])
缺省情况下,执行 noConflict 会将变量 $ 的控制权移交给第一个产生 $ 的库;当 removeAll 设置为 true 时,执行 noConflict 则会将 $ 和 jQuery 对象本身的控制权全部移交给第一个产生他们的库。
例如在 KISSY 和 jQuery 混用,并且惯用 $ = KISSY 来简化 API 操作的时候,就能够通过这个方法解决命名冲突的问题。
那么这个机制是如何实现的呢?阅读 jQuery 源码开头[2],首先做的一件事情是这样的:
// Map over jQuery in case of overwrite
_jQuery = window.jQuery, // Map over the $ in case of overwrite
_$ = window.$,
容易理解的是,jQuery 通过两个私有变量映射了 window 环境下的 jQuery 和 $ 两个对象,以防止变量被强行覆盖。一旦 noConflict 方法被调用,则通过 _jQuery, _$, jQuery, $ 四者之间的差异,来决定控制权的移交方式,具体的代码如下:
noConflict: function( deep ) {
if ( window.$ === jQuery ) {
window.$ = _$;
}
if ( deep && window.jQuery === jQuery ) {
window.jQuery = _jQuery;
}
return jQuery;
}
再来看上面所说的参数设定问题,如果 deep 没有设置,_$ 覆盖 window.$,此时 jQuery 别名 $ 失效,但 jQuery 本身完好无损。如果有其他类库或代码重新定义了 $ 变量,它的控制权就完全交接出去了。反之如果 deep 设置为 true 的话,_jQuery 覆盖 window.jQuery,此时 $ 和 jQuery 都将失效。
这种操作的好处是,不管是框架混用还是 jQuery 多版本共存这种高度冲突的执行环境,由于 noConflict 方法提供的移交机制,以及本身返回未被覆盖的 jQuery 对象,完全能够通过变量映射的方式解决冲突。
但无法避免的事实是可能导致的插件失效等问题,当然通过简单修改上下文参数即可恢复 $ 别名:
var query = jQuery.noConflict(true);
(function ($) { // 插件或其他形式的代码,也可以将参数设为 jQuery })(query);
[1] http://api.jquery.com/jQuery.noConflict/#jQuery-noConflict-removeAll
[2] https://github.com/jquery/jquery/blob/master/src/core.js
转载:http://ued.taobao.com/blog/2013/03/jquery-noconflict/
jQuery 中的防冲突(noConflict)机制的更多相关文章
- 谈谈 jQuery 中的防冲突(noConflict)机制
许多的 JS 框架类库都选择使用 $ 符号作为函数或变量名,jQuery 是其中最为典型的一个.在 jQuery 中,$ 符号只是 window.jQuery 对象的一个引用,因此即使 $ 被删除,w ...
- jQuery中 $ 符号的冲突问题
jQuery中 $ 符号的冲突问题是常见问题之一. 在jQuery中,$是jQuery的别名,为了书写方便,我们更习惯用$('#id')这一类的方式来书写代码.当同一页面引用了jQuery多个版本 ...
- nRF24L01+组网方式及防撞(防冲突)机制的实战分享
利用多个nRF24L01+模块组网通信的实现方式 这里讨论的组网方式,不包含使用6个通道实现的多对1通信方式,因其只限于6个发送端,局限性很大,可以附加其他技术实现更好的组网,暂时这里不讨论.这里分享 ...
- 关于jQuery中的$发生冲突及解决方案
问题描述: 在Jquery库中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg')的写法. 当引入多个js库后,其它的js库 ...
- 射频识别技术漫谈(5)——防冲突【worldsing 笔记】
正常情况下读写器某一时刻只能对磁场中的一张射频卡进行读写操作.但是当多张卡片同时进入读写器的射频场时,读写器怎么办呢?读写器需要选出唯一的一张卡片进行读写操作,这就是防冲突. 防冲突机制是非接触式智能 ...
- jQuery库(noConflict)冲突解决机制
很多JSFramework库选择使用$符号作为一个函数或变量名,而在实际的项目开发,模板语言,则有可能"$"符号是模板语言keyword.例如Veclocity模板语言,$它是ke ...
- noConflict冲突处理机制
最近接手了一个古早项目,用的backbone,于是正好学习一下早期MVC框架的源码. 这篇主要写冲突处理机制,源码其实就一个函数,代码也很短.原理也很好理解,总结起来就是:每执行一次noConflic ...
- 解决jQuery中美元符号($)命名与别的js脚本库引用冲突方法
在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法.然而,当我们引入多个js库后,在另外一个js库 ...
- jQuery中$符号冲突问题 (转载)
Jquery的$命名冲突: 在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法.然而,当我们引入多 ...
随机推荐
- Yii中CDbCriteria常用方法
最近在使用Yii 下面是常用到的方法,这里保存一下方便查看 $criteria =newCDbCriteria; $criteria->addCondition("id=1" ...
- 【翻译】Ext JS最新技巧——2014-5-12
原文:mkt_tok=3RkMMJWWfF9wsRoluazJZKXonjHpfsX77OQlXK%2B%2FlMI%2F0ER3fOvrPUfGjI4AT8NjI%2BSLDwEYGJlv6SgFS ...
- android 带表头,左右两个联动的ListView
package com.rytong.mylist; import java.util.ArrayList; import java.util.HashMap; import java.util.Li ...
- 编程之linux与win区别
换行符在Linux和Windows下的区别 一.区别 换行符: 1.windows中的换行符是\r\n, 2. linux/unix下的换行符是\n. 其中: 回车符:\r=0x0d (13) ret ...
- Hibernate: Truly Understanding the Second-Level and Query Caches--reference
I've written multiple articles here at Javalobby on the Hibernate O/R mapping tool, and they are usu ...
- qt-vs-addin-版本支持
qt-vs-addin-1.2.0-opensource.exe VS200X qt-vs-addin-1.2.1-opensource.exe VS200X qt-v ...
- About xvfb
http://blog.csdn.net/span76/article/details/11473315 有时候我们不关注程序是否有界面(比如自动化测试),只要程序在运行就可以了 很感谢 xvfb 这 ...
- c++与c不太相同的一些地方2
1.一般全局变量放到cpp 文件里面,而不是.h 里面.要不然容易乱套,这个乱几次就好了,先记住这样一种编码规范. 以为大家都引入就比较麻烦,但是实现起来就只有cpp里面才有.毕竟.h是要被包含的文件 ...
- UVA 11021 - Tribles(概率)
http://uva.onlinejudge.org/index.php?option=com_onlinejudge&Itemid=8&category=481&page=s ...
- hdu 1095 A+B for Input-Output Practice (VII)
A+B for Input-Output Practice (VII) Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32 ...