jQuery中$符号冲突问题 (转载)
Jquery的$命名冲突:
在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法。然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突。下面以引入两个库文件 jquery.js和prototype.js为例来进行说明。
第一种情况:jquery.js在prototype.js之后进行引入,如:
<script src="prototype.js" type="text/javascript"/>
<script src="jquery.js" type="text/javascript"/>
在这种情况下,我们在自己的js代码中如下写的话:
$('#msg').hide();
$永远代表的是jquery中定义的$符号,也可以写成JQuery('#msg').hide();如果想要使用prototype.js中定义的$,我们在后面再介绍。
第二种情况:jquery.js在prototype.js之前进行引入,如:
<script src="jquery.js" type="text/javascript"/>
<script src="prototype.js" type="text/javascript"/>
在这种情况下,我们在自己的js代码中如下写的话:
$此时代表的prototype.js中定义的$符号,如果我们想要调用jquery.js中的工厂选择函数功能的话,只能用全称写法JQuery('#msg').hide().
下面先介绍在第一种引入js库文件顺序的情况下,如何正确的使用不同的js库中定义的$符号。
一.使用JQuery.noConflict()
该方法的作用就是让Jquery放弃对$的所有权,
将$的控制权交还给prototype.js,因为jquery.js是后引入的,所以最后拥有$控制权的是jquery。它的返回值是JQuery。当
在代码中调用了该 方法以后,我们就不可以使用$来调用jquery的方法了,此时$就代表在prototype.js库中定义的$了。如下:
JQuery.noConflict();
//此处不可以再写成$('#msg').hide(),此时的$代表prototype.js中定义的$符号。
JQuey('#msg').hide();
自此以后$就代表prototype.js中定义的$,jquery.js中的$无法再使用,只能使用jquery.js中$的全称JQuery了。
二.自定义JQuery的别名
如果觉得第一种方法中使用了JQuery.noConflict()方法以后,只能使用JQuery全称比较麻烦的话,我们还可以为JQuery重定义别名。如下:
var $j=JQuery.noConflict();
$j('#msg').hide();//此处$j就代表JQuery
自此以后$就代表prototype.js中定义的$,jquey.js中的$无法再使用,只能使用$j来作为jquey.js中JQuery的别名了。
三.使用语句块,在语句块中仍然使用jquery.js中定义的$,如下:
jQuery.noConflict();
jQuery(document).ready(function($){
$('#msg').hide();//此时在整个ready事件的方法中使用的$都是jquery.js中定义的$.
});
或者使用如下语句块:
(function($){
.....
$('#msg').hide();//此时在这个语句块中使用的都是jquery.js中定义的$.
})(jQuery)
如果在第二种引入js库文件顺序的情况下,如何使用jquery.js中的$,我们还是可以使用上面介绍的语句块的方法,如:
代码 <script src="jquery.js" type="text/javascript"/>
<script src="prototype.js" type="text/javascript"/>
<script type="text/javascript"> (function($){
.....
$('#msg').hide();//此时在这个语句块中使用的都是jquery.js中定义的$.
})(jQuery)
</script>
这种使用语句块的方法非常有用,在我们自己写jquery插件时,应该都使用这种写法,因为我们不知道具体工作过程中是如何顺序引入各种js库的,而这种语句块的写法却能屏蔽冲突。
转载自:http://www.cnblogs.com/RascallySnake/archive/2010/05/07/1729417.html
jQuery中$符号冲突问题 (转载)的更多相关文章
- Electron与jQuery中$符号冲突的三种解决方法
在Electron工程中引用jQuery时,经常会出现以下错误: Uncaught ReferenceError: $ is not defined 解决的具体方法如下: ①.在测试的过程中(测试过1 ...
- jQuery中 $ 符号的冲突问题
jQuery中 $ 符号的冲突问题是常见问题之一. 在jQuery中,$是jQuery的别名,为了书写方便,我们更习惯用$('#id')这一类的方式来书写代码.当同一页面引用了jQuery多个版本 ...
- jQuery的AJAX方法简介及与其他文件$符号冲突的解决办法
一.重要的jQuery AJAX方法简介 $.load(url) 从服务器载入数据 $.get(url,callback) 从服务器请求数据,并执行回调函数 $.post(url,data,callb ...
- JQuery的$命名冲突详细解析
在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg')的写法.然而,当我们引入多个js库后,在另外一个js库中 ...
- jQuery库(noConflict)冲突解决机制
很多JSFramework库选择使用$符号作为一个函数或变量名,而在实际的项目开发,模板语言,则有可能"$"符号是模板语言keyword.例如Veclocity模板语言,$它是ke ...
- JQuery原理及深入解析--转载
总体架构 jQuery是个出色的javascript库,最近结合它写javascript,看了下源码. 先从整体.全局的看,jQuery的源码几乎都在下面的代码中: (function() { //… ...
- jquery源码中noConflict(防止$和jQuery的命名冲突)的实现原理
jquery源码中noConflict(防止$和jQuery的命名冲突)的实现原理 最近在看jquery源码分析的视频教学,希望将视频中学到的知识用博客记录下来,更希望对有同样对jquery源码有困惑 ...
- jquery 中$符号六大作用
jquery 中$符号六大作用 2012-12-16 86市场网 javascript a.$用作选择器, var e = $("h1 a"); var f = $("t ...
- jQuery中$符号的作用
jQuery中$符号的作用 1.查找作为jQuery包装器,利用选择器来选择DOM元素(这个也是最强大的功能) 例如:$("table tr:nth-child(even)") 基 ...
随机推荐
- [LA] 3027 - Corporative Network [并查集]
A very big corporation is developing its corporative network. In the beginning each of the N enterpr ...
- php----浅谈一下empty isset is_null的用处
} } { } { } } } { } { } is_null():判断变量是否为null if ($a){} 那这个未声明变量会报noti ...
- Ubuntu apache 禁止目录浏览
$ sudo vim /etc/apache2/sites-enabled/000-default 将Options后面Indexes前面加上"-"表示禁止目录浏览: <Di ...
- 关于java.sql.SQLRecoverableException: Closed Connection异常的解决方案(转)
在项目中碰到了一个应用异常,从表象来看应用僵死.查看Weblogic状态为Running,内存无溢出,但是出现多次线程堵塞.查看Weblogic日志,发现程序出现多次Time Out. 我们知道,We ...
- paip.Adblock屏蔽onlinedown华军软件园的4秒下载广告总结..
paip.Adblock屏蔽onlinedown华军软件园的4秒下载广告总结.. 作者Attilax , EMAIL:1466519819@qq.com 来源:attilax的专栏 地址 ...
- C++函数后面加const修饰
声明一个成员函数的时候用const关键字是用来说明这个函数是 "只读(read-only)"函数,也就是说明这个函数不会修改任何数据成员(object). 为了声明一个const成 ...
- SCOI2014省选总结
这一次省选,主要是抱着玩的心态去的,如同高二的那些大神高一的心态一样,只记得在省选之前我们一直在说,这一次我们的目标,就是不爆0,最后也如愿以偿的实现了. 首先,请允许我吐槽一下day1.....da ...
- java算法之冒泡排序法
由此可见:N个数字要排序完成,总共进行N-1趟排序,每第 i 趟的排序次数为 (N-i) 次,所以 可以用双重循环语句,外层控制循环多少趟,内层控制每一趟的循环次数,即 for(inti=0;i& ...
- Non-negative Partial Sums(单调队列)
Non-negative Partial Sums Time Limit: 6000/3000 MS (Java/Others) Memory Limit: 65536/32768 K (Jav ...
- 炉石传说__multiset
炉石传说 Problem Description GG学长虽然并不打炉石传说,但是由于题面需要他便学会了打炉石传说.但是传统的炉石传说对于刚入门的GG学长来说有点复杂,所以他决定自己开发一个简化版 ...