关于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 ( deep && window.jQuery === jQuery ) {
window.jQuery = _jQuery;
}

return jQuery;
};

 刚开始,我一直没看懂它是怎么释放$和jQuery的。经过和别人的讨论,终于理解清楚了,特此记录下,供大家参考

1,首先,它的使用场景是我们在一个已经有其他框架的项目中再引入jquery.为了使我们的引入不影响前面的功能,所以我们要释放

2,只有在jquery在其他库后面引入才有能有效释放。如果jquery最先引入。则执行该方法,没有意义!

下面,我对上面的代码坐个说明:

在加载进该库时,首先

_jQuery = window.jQuery,   _$ = window.$;
这里的 window.$和window.jQuery是指向指向之前全局环境的。(即你可以认为此时还没有加载jquery库)。
jQuery.noConflict=function(){};这里定义了一个函数,当你在执行时,此时jquery肯定以后完成了加载。所以此时的
window.$ 和 window.jQuery 是真正的指向了jquery库的这个jquery全局对象。通过执行函数。我们用之前的全局对象缓存来覆盖这两个变量。达到释放的目的。
时间: 2025-01-10 17:37:30

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

jQuery Moblile Demos学习记录Theming、Button、Icons图标,脑子真的不好使。

jQuery Moblile Demos学习记录Theming.Button.Icons图标,脑子真的不好使. 06. 二 / Jquery Mobile 前端 / 没有评论 本文来源于www.ifyao.com禁止转载!www.ifyao.com 一CSS Framework块 Theming 是一个整体了解默认主题和内置的A-E主题各个效果.待解决问题,自定义主题,下边是一个知识点. http://www.w3cschool.cc/jquerymobile/jquerymobile-them

jQuery Moblile Demos学习记录Panel

jQuery Moblile Demos学习记录Panel 11. 二 / Jquery Mobile / 没有评论 本文来源于www.ifyao.com禁止转载!www.ifyao.com 我就简短的总结一下: Panel位置:data-position属性控制:值:left,right, 显示方式:data-display属性   值:reveal默认在页面之下,overlay页面上,push和页面统一,将页面推开. Panel应该放在header,content,footer之前或者之后,

Jquery基础教程第二版学习记录

本文仅为个人jquery基础的学习,简单的记录以备忘. 在线手册:http://www.php100.com/manual/jquery/第一章:jquery入门基础jquery知识:jquery能做什么:为什么需要jquery. 第二章:选择符工厂函数$()css选择符属性选择符自定义选择符DOM遍历方法 第三章:事件jQuery.noConflict([extreme]):运行这个函数将变量$的控制权让渡给第一个实现它的那个库.常用方法:(包括键盘,鼠标事件)blur([[data],fn]

jQuery学习记录1

jquery 和 js css里面都是坑呀 this.style.backgroundColor 和 css {background:#8df;} 是冲突的,用了前者,再$(this).addClass("css class name");效果显示不出来. http://youchenglin.iteye.com/blog/685026 前他的一些内容参见下列代码 <!DOCTYPE html> <html> <head> <meta char

学习记录jQuery的animate函数

很久之前就对jQuery animate的实现非常感兴趣,不过前段时间很忙,直到前几天端午假期才有时间去研究. jQuery.animate的每种动画过渡效果都是通过easing函数实现的.jQuery1.4.2中就预置了两个这样的函数: easing: {linear: function( p, n, firstNum, diff ) {return firstNum + diff * p;},swing: function( p, n, firstNum, diff ) {return ((

JS学习记录(jQuery)

jQuery入门<html lang="en"> <head> <meta charset="UTF-8"> <title>jQuery入门</title> </head> <body> <p id="content" class="first">青岛理工大学</p> <p id="content2&qu

jquery dataTable的学习

分页 bPaginite:true;是否启用分页功能 sPaginationType:two_button  或者full_numbers 分页风格 sFirst:告诉他第一页怎么写 sLast:告诉他最后一页怎么写 sNext:告诉他下一页怎么写 sPrevious:告诉他上一页怎么写 语言 "sInfo":"共_TOTAL_页 第_START_到_END_页", "sEmptyTable":"没有数据" "sIn

菜鸟的jQuery源码学习笔记(二)

jQuery对象是使用构造函数和原型模式相结合的方式创建的.现在来看看jQuery的原型对象jQuery.prototype: 1 jQuery.fn = jQuery.prototype = { 2 //成员变量和方法 3 } 这里给原型对象起了一个别名叫做jQuery.fn.要注意的是这个jQuery.fn可不是jQuery对象的属性,而是jQuery构造方法本身的属性,它是不会传给它所创建的对象的.如果你在控制台敲$().fn的话输出的结果会是undefined.接下来看看原型对象里面有些

tempo 2.0 学习记录

最近在做项目时使用了tempo,感觉还不错,但是发现网上对于tempo 2.0 的介绍比较少,我也是在GitHub才找到了比较完整的使用说明,我也简单记录一下自己的使用过程,重新学习一下tempo 2.0 , 不喜勿喷,喜欢看英文的朋友请移步tempo 2.0 英文说明 . 1.引入tempo.js <script src="js/tempo.js" type="text/javascript"></script> 2.准备数据Data(标准