终极解决jQuery与$冲突

我们公司用的是jQuery1.4.2，还有jQuery1.3.2，还有可能要用1.2或者1.1的。至于要用这么多版本完全是因为插件是基于某个版本开发的。如果统一用一个版本的框架，会导致插件运行不正确。此外还用了prototype1.6.2，用prototype是因为click框架自带的。这样冲突就十分严重了，首先$就有prototype和jQuery的冲突，而且还有高端冲突即jQuery各版本之间对于jQuery引用的冲突。
（1）首先解决$的冲突，由于项目的click框架是用了jQuery1.3.2和prototype，并且可能要随Apache更新（意味着改了也是白改），而且改动jQuery1.3.2量大，因为很多插件是基于jQuery1.3.2的，并且有可能基于jQuery1.3.2的插件代码是用Java生成的（这无法改，因为源代码是jar包的）。因此考虑去掉prototype的$引用，改动量少。（测试不通过）

第一步：找到prototype.js源代码，将function $(element) {。。。}，修改成function $p6(element) {。。。}这将废弃原来的$命名空间，将其换成$p6。同时在后面加上两句var _temp$ = window.$;window.$=$p6;。这两句是为了保证prototype.js的里面引用了$的源代码能够正常使用，同时将别的框架的$引用暂存到临时变量空间中去。把这一句window.$ = _temp$;（返还$的控制权限给jQuery）放在文件的末尾会报错，不知道为什么，估计是prototype.js程序运行到最后，这个程序并没有结束，还要回到前面的代码去执行，而前面的代码还要用$，如果返还给jQuery了，当然就报错了。本人没用过prototype，只能这样猜测。

第二步：在基于prototype.js框架的所有插件的
头部加上以下代码
var _temp$ = window.$;//将jQuery1.3.2的$放到临时的变量空间上
window.$=$p6;//将prototype新的命名空间$j6赋予给$，这样做的目的是保持中间的原始代码对于$的引用不用改动，也就是不用改动中间原始的插件代码，同时又不会引用到jQuery1.3.2的$。

【中间的原始代码不动】

尾部加以下代码
window.$ = _temp$;//将$的引用权限返还给jQuery1.3.

 

第三步：以后要用基于prototype的选取函数就只能用$p6(element)了。

 但是按照以上这种方式将prototype放弃$的做法，不知道为什么不可以。网上百度的资料也全是jQuery放弃$的控制权，不知道为什么？期待牛人解答。但是以下的（2）是本人测试过行的通的。至于jQuery放弃$控制权网上文章一大堆。大概就是两种情况（一）jQuery.js放在prototype.js前面，这个时候jQuery只能用jQuery来进行引用，prototype写的代码无需任何改动。（二）jQuery.js放在prototype.js后面，由于jQuery在后，默认它的$命名会覆盖掉prototype定义的$，因此需要多这么一句jQuery.noConflict();。它的意思就是释放它定义的$命名，并还原以前的$定义即prototype定义的$。

 

 

（2）再来解决jQuery1.3.2和1.4.2的冲突。（测试通过）

第一步：在1.4.2的源代码的最后加上一句 var $j4 = jQuery.noConflict(true);//之所以在源码这里加，而不是像大多数文章提的在要用到的时候加，这是因为很多基于1.4.2的插件都要加，在这里加可以避免过多插件加这句代码导致重复。这一句是将1.4.2的jQuery和$的引用权限全部放弃。也就是基于1.4.2的插件不能再用jQuery和$了。同时给予$j4的新的命名空间，注意它是window的属性。看1.4.2的源代码会发现它其实也就执行了这两句：window.$=_$;window.jQuery=_jQuery，道理同window.$=_temp$（返还命名空间）只是命名不同而已。

第二步：在基于1.4.2的框架的所有插件的

头部加上以下代码
var _temp$ = window.$,_tempjQuery = window.jQuery;/将jQuery1.3.2的$和jQuery放到临时的变量空间上
    window.$ = $j4;//这句和下面的那句都是为了给中间的代码能够正确使用jQuery和$用的。后面的$j4是赋予他们正确的引用。
    window.jQuery = $j4;
之所以要先放临时变量存储，有三点必须这样做的理由：

a：我们不希望改动大量的jQuery插件源代码，最好是不动，即使改的话，尽量改的少。而在头部尾部加改动代码，中间的原始代码不动也是不错的一种方式。

b：因为1.4.2的已经放弃了jQuery和$的控制权，但是已有的插件代码又用了他们来做引用，因为插件不可能预知冲突，即使有冲突他人开发的插件也一定要用$或者jQuery引用，除非它不是jQuery下的插件。

c：为了防止插件里面直接用window.$和window.jQuery进行引用从而导致引用到1.3.2的jQuery和$，虽然这种情况比较少，但是以防万一。

【中间的原始代码不动】

尾部加以下代码
window.$ = _temp$;//将$的引用权限返还给jQuery1.3.
window.jQuery = _tempjQuery;//将jQuery的引用权限返还给jQuery1.3.

 

第三步：以后要用基于jQuery1.4.2的选取函数就只能用$j4(element)了。

总结：到目前为止可行方案：jQuery1.4.2完全放弃$和jQuery的控制权限。1.3.2放弃$的控制权限但不放弃j
Query的权限，其实jQuery也可放弃，只不过要给个别名$j3。prototype最好放在jQuery1.3.2后面，它获得$的控制权限。只是以后
要用jQuery1.4.2就必须用$j4来引用了。但这样即使有再多的jQuery框架版本冲突问题，也全部解决掉了。假如来了个1.2的jQuery怎么办，参照（2）的执行步骤，只不过第一步改为var $j2 = jQuery.noConflict(true);第三步用$j2(element)罢了。道理都是相同的。

 

没有解决的问题：如果prototype的版本之间有$冲突怎么办呢？本人没学过prototype，不清楚它的解决方案。本来我以为按照jQuery解决冲突的方案是完全可以的，但是测试结果发现不行。坐等高人降临。

 

 

【本文JavaEye原创，转载请申明出处】