jQuery源码阅读（三）--解决冲突noConflict()

本文主要是介绍jQuery源码阅读（三）--解决冲突noConflict()，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

今天一行行看jQuery代码，大体看下来，jQuery源码的顺序大概是这些内容：

一些变量和函数，包括jQuery对象的创建
jQuery.extend和jQuery.fn.extend
jQuery.extend扩展的一些工具方法
回调函数Callbacks,包括有add方法和fire方法
延迟对象Deferred
jQuery.support , jQuery功能检测
jQuery 数据缓存，包括jQuery挂载的静态方法data(), acceptData()等，以及在jQuery对象上的方法data()；
队列管理，出队入队queue(),dequeue()，主要在动画中用的比较多
元素的属性操作，比如attr(), removeAttr(); addClass(), removeClass(), toggleClass(); hasClass(); val()等等
jQuery事件jQuery.event; 有add,remove方法；还有bind, one, trigger等
Sizzle选择器，用来处理各种复杂的选择器，得到选中的jQuery对象或者jQuery对象集合
DOM元素遍历，DOM的增删改，以及包裹等等操作
对DOM样式的操作，即css()方法
aJax功能，ajax(), getJSON(), getScript()等等
动画方法，show(), hide(), toggle(), fadeTo(), animate(), stop()等等
各种offset，即获取尺寸和位置方法
jQuery对模块化的支持，AMD，COMMONJS等，我看的jQuery1.7.2只有对AMD的支持，后面高版本对COMMONJS也支持。

下来先看一些变量：

//在创建jQuery对象之后
rootjQuery = jQuery(document);
//这样做的主要目的是后面用的时候既能保持语义，又可以减少代码量
readyList      //与DOM加载有关；可以在ready函数中看到对readyList的使用
location = window.location;
document = window.document;
navigator = window.navigator_$ = window.$;
_jQuery = window.jQuery;  /这两个变量主要是用于解决冲突的

下来我主要想跟大家分享一下解决冲突实现原理及源码：
我们知道，在使用jQuery的时候，如果先引用了别的库，然后再引用jQuery库，为了跟别的库在使用 $上不会冲突，要解决冲突，即jQuery释放掉对$ 的使用权。
直接调

jQuery.noConflict();
$()      //利用的是别的库；

jQuery.noConflict(true);    //不仅释放掉$的使用权，也释放掉jQuery的使用权
jQuery();  //再调jQuery时，是上一个引入的jQuery库了；或者没有

那么jQuery中的noConflict是如何实现的？

_$ = window.$;
_jQuery = window.jQuery;jQuery.extend({noConflict: function(deep){if(window.$ === jQuery){window.$ = _$;}if(deep && window.jQuery === jQuery){window.jQuery = _jQuery;}return jQuery;}
})

跟着源码缕一下思路：
假设我们在html文件中，先引入了一个其他的库，比如说prototype.js，引入之后, 此时的window.$是prototype.js库中的。而如果后面再引入jQuery.js库，这个时候window.$和window.jQuery都是jQuery方法，相当于覆盖了原来的prototype.js库中的$。

那么在noConflict函数中，就先判断window.$与jQuery是否相等，如果相等，说明这时候jQuery库中的$被覆盖掉了，这时候重置window.$,即将window.$让给之前的库。如何得到之前库的$, 这个值是保存在 _$中的。有点绕，不过比较容易理解。
当参数deep为true时，把jQuery的使用权也让出去，逻辑跟上面是类似的。

这篇关于jQuery源码阅读（三）--解决冲突noConflict()的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！