jQuery源码,想让两个jQuery库并存 怎么做?
<script src="./jquery1.11.3"></script>
<script src="./jquery3.4.1"></script>
$ = jQuery 1.11.3 ; //先引入1.11.3 版本
$ = jQuery 3.4.1 ; //然后引入3.4.1 版本
内部处理
var _jQuery = window.jQuery; jQuery1.11.3
_$ = window.$ ; jQuery1.11.3
window.jQuery = window.$ = jQuery; jQuery3.4.1
let j = $.noConflict(true);
if (window.$ === jQuery) { //如果 $ 和 jQuery 相同
window.$ = _$; jQuery1.11.3 把3.4.1版本使用$权利转让给了 1.11.3
现在 window.$ 就是1.11.3版本
}
if (deep && window.jQuery === jQuery) { // deep===true ;(window.jQuery3.4.1 === jQuery 3.4.1) === true
window.jQuery = _jQuery; // 1.11.3
};
return jQuery; // 最新的版本 3.4.1
$ => 外面使用 $ 代表 jQuery => 1.11.3 版本
j => 外面使用 j 代表 jQuery => 3.4.1 版本
// $('.box') 每一次执行都是创建了一个jq类的新实例(JQ对象);
// =》$(".box") !==$(".box") 两个不同的实例,开辟了两个堆内存;
// ===========函数的多种角色:普通函数/构造函数(类)/普通对象
// =》在控制台输出 jQuery.fn 可以查看原型上的方法,这些方法都可以被实例调用 (此时把jquery看作一个类);
// =》但jq也是一个普通对象,在普通对象上也有很多方法,
// 这些方法和实例没有直接的关系,基于$.xxx()调用,例如:$.Callbacks() 或者 $.ajax() 等 ;
// dir($) jQuery函数、对象
// dir($.fn) jQuery 类
let $box = $('.box');
$('.box').click(() => {}); // 开辟了3个实例 消耗性能
$('.box').fadeIn(() => {});
$('.box').addClass(() => {});
/* */
$box.click(() => {}); // 只开辟了一个实例
$box.fadeIn(() => {});
$box.addClass(() => {});