解决jquery中美元符号命名冲突问题

 在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,下面为大家介绍下如何解决jquery中美元符号命名冲突问题

在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法。然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突。下面以引入两个库文件 jquery.js和prototype.js为例来进行说明。 
 
第一种情况:jquery.js在prototype.js之后进行引入,如: <</span> script src = " prototype.js " type = " text/javascript " /> 
<</span> script src = " jquery.js " type = " text/javascript " /> 
在这种情况下,我们在自己的js代码中如下写的话: 
$( ' #msg ' ).hide(); 
$永远代表的是jquery中定义的$符号,也可以写成JQuery('#msg').hide();如果想要使用prototype.js中定义的$,我们在后面再介绍。 
 
第二种情况:jquery.js在prototype.js之前进行引入,如: <</span> script src = " jquery.js " type = " text/javascript " /> 
<</span> script src = " prototype.js " type = " text/javascript " /> 
在这种情况下,我们在自己的js代码中如下写的话: 
$( ' #msg ' ).hide(); 
$此时代表的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中的$,我们还是可以使用上面介绍的语句块的方法,如: 
<</span> script src = " jquery.js " type = " text/javascript " /> 
<</span> script src = " prototype.js " type = " text/javascript " /> 
<</span> script type = " text/javascript " > 
(function($){ $( ' #msg ' ).hide(); // 此时在这个语句块中使用的都是jquery.js中定义的$. })(JQuery) 
</</span> script > 
这种使用语句块的方法非常有用,在我们自己写jquery插件时,应该都使用这种写法,因为我们不知道具体工作过程中是如何顺序引入各种js库的,而这种语句块的写法却能屏蔽冲突。 
 
ps :jquery中特殊字符的含义: 
#  指示 id  
.  指示 class  
*  全选  
,  多选  
空格 后代  
>  子  
~  兄弟  
+  下一个  
:  子(多功能)  
()  函数式的过滤与查找 
 

时间: 2024-12-21 16:57:53

解决jquery中美元符号命名冲突问题的相关文章

解决jquery中美元符号命名冲突问题_jquery

在Jquery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法.然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突.下面以引入两个库文件 jquery.js和prototype.js为例来进行说明. 第一种情况:jquery.js在prototype.js之后进行引入,如: <</span> script src = " prototyp

解决JQuery中美元符号($)与$命名冲突

在JQuery中,$是JQuery的别名,所有使用$的地方也都可以使用JQuery来替换,如$('#msg')等同于JQuery('#msg') 的写法.然而,当我们引入多个js库后,在另外一个js库中也定义了$符号的话,那么我们在使用$符号时就发生了冲突.下面以引入两个库文件 jquery.js和prototype.js为例来进行说明. 第一种情况:jquery.js在prototype.js之后进行引入,如:  代码如下 复制代码 < script src = " prototype.

prototype框架中美元符号$用法分析_javascript技巧

本文实例讲述了prototype框架中美元符号$用法.分享给大家供大家参考,具体如下: prototype是实现面向对象的一个重要工具,是javascript的一个不错的框架. 用jquery的人都知道,jquery中也有$美元符号,prototype中呢,也有$,他们有什么区别呢. 1.prototype中$()的用法 prototype写法 $("test") 或者 $$("#test"), 他相当于js中document.getElementById(&quo

APS.NET和MVC3解决jQuery中Ajax的乱码问题

encodeURIComponent() 函数可把字符串作为 URI 组件进行编码. 转自http://blog.csdn.net/allsharps/article/details/6875419 解决jQuery中Ajax的乱码问题   $(document).ready(function(){   //    alert(encodeURI("我"));       $.ajax({url:"a.php?a=" + encodeURIComponent(&qu

解决jquery中动态新增的元素节点无法触发事件问题的两种方法_jquery

比如做一个ajax读取留言列表的时候,每条留言后面有个回复按钮,class为"reply",如果你用的是$(".reply").click(function(){ //do something... }),想必后面通过ajax加载进来的列表中的回复按钮,点击事件会失效. 其实最简单的方法就是直接在标签中写onclick="",但是这样写其实是有点low的,最好的方式还是通过给类名绑定一个click事件. 解决jquery中动态新增的元素节点无法触

jQuery解决$符号命名冲突_jquery

前些天朋友让我帮他解决一个页面中jquery特效的兼容性问题,觉得这是一个很容易忽略也很重要的一点,特在此记录一下. 朋友给的页面中用到了三个特效,其中两个特效可以显示,第三个没有效果.通过查看引用的js文件,我发现页面中不光引入了jquery.js,还引入了一个名为prototype.js的文件. 这个prototype.js之前未曾听说过,特意在百度上搜了一下,原来它也是一个js类库,功能和jquery差不多,而且很强大. 通过一点点的排查,我发现那两个可以显示的特效引用的是jquery,而

解决JQuery中$与JS插件库相冲突问题

在代码前加入下面代码 把之后的jquery中的$都用jq代替即可.  代码如下 复制代码 <script type="text/javascript"> jq = jQuery.noConflict(); //以后jquery中的$都用jq代替即可. jq(function(){}); </script>   记得要在载入完各js库后才能用jQuery.noConflict()进行重载哦, 如例子中的prototype和jquery.  代码如下 复制代码 va

php中$美元符号与Zen Coding冲突问题解决方法分享_php技巧

Zen Coding插件就不多做介绍了. 众所周知,安装了插件以后,输入$符号会被自动解析为相应的数字1.2.3... 作为一名PHP程序员,想要通过其定义一些自己常用的代码.却发现展开以后悲剧的发现$符号全变成了数字. 下面教你解决方法:

JQuery中的ready函数冲突的解决方法_jquery

一个aspx页面通常可以包含其它ascx控件,如果在多人协同开发的情况下:程序员小张在控件A.ascx中使用了 $().ready(function{}),而程序员小王又在控件B.ascx中也使用了ready函数,程序员小李在做页面时,把A.ascx,B.ascx都拖到自己的页面中,然后在页面中也需要用到$().ready函数,这下好了: 虽然jQuery本身的设计还算不错,document加载完成后会依次触发各个ready中定义的function(这一点很好,不象javascript中默认后面