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)") 基 ...
随机推荐
- Honkly分享链接集总篇
VC6.0 Filetool Honkly版 http://pan.baidu.com/s/1bnentr5 密码:15eq,解压密码:honkly VC6.0 Filetool 官方 ...
- 【温故而知新:文件操作】C#的文件读写相关
StreamReader类以及其方法ReadLine,Read,ReadToEnd的分析 首先StreamReader类的构造参数非常丰富在这里,我觉得最常用的就是StreamReader(Strea ...
- Spring Boot 启动加载数据 CommandLineRunner
实际应用中,我们会有在项目服务启动的时候就去加载一些数据或做一些事情这样的需求. 为了解决这样的问题,Spring Boot 为我们提供了一个方法,通过实现接口 CommandLineRunner 来 ...
- eclipse编辑工具小结
eclipse编辑工具小结 这两天从myeclipse转入eclipse,整体感觉不错,速度更快些,也没在出现各种意外的调试错误.不能断点等情况,并且对整个编辑环境的使用有了更深入的认识,再次对主要几 ...
- SQL Server (MSSQLSERVER) 服务因 找不到指定的模块。 服务特定错误而停止。
新装了sql server 2008,发现sqlserver 服务没法起来.查看系统日志是7024如下: 事件类型: 错误 事件来源: Service Control Manager 事件种类: 无 ...
- CentOS下安装无线网卡驱动 (转)
1. 确定自己的网卡和内核版本:lspci | grep Network #根据输出的信息确定网卡的型号.uname -a #确定内核版本 2. 配置yum使用RPMForg ...
- Using HTML5 audio and video
From:https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_HTML5_audio_and_video Using HTML5 ...
- Hdu5381-The sum of gcd(莫队)
题意我就不说了 解析: 莫队,先预处理出以i为右端点的区间的gcd值,有一些连续的区间的gcd值是相同的,比如[j,i],[j+1,i],[j+2,i]的gcd值是相同的,我们可以把[j,j+2] ...
- VS快捷编码方式
概念: 代码段是将预先定义好的可重用代码块快速插入到代码文件中,代码段提高了开发效率,增强了代码的可重用性:既节约了时间,又实现了不同开发人员间代码的共享.同时也可保证同一项目中代码风格的统一. ...
- Unity 白猫操作小实例
最近师兄找我说白猫的操作如何做, 0.0 结果白猫没有android的客户端玩不了,看了下视频介绍就简单做了下 效果图: 核心代码: using UnityEngine; using Syste ...