夜月琉璃Lv46
多个jQuery版本如何实现共存？
jQuery自诞生以来，版本越来越多，而且jQuery官网的新版本还在不断的更新和发布中，现已经达到了2.x甚至更新的版本，但是我们在以前的项目中就已经使用了旧版本的jQuery，比如已经出现的：1.3.X、1.4.X、1.5.X、1.6.2等等。
由于项目的需要，必然也需要不断的使用较新版的jQuery，但对于原来就已经存在并已经采用了的旧jQuery版本，我们如何让多个不同的jQuery版本在同一个页面并存而不冲突呢？
其实，利用jQuery.noConflict()特性，我们不仅可以让jQuery与其他的JS库并存，比如Prototype。也可以与jQuery本身的其他不同版本并存而不冲突。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>在同一个页面中加载多个不同的jQuery版本</title>
<!-- 加载jQuery最新版本-->
<script type="text/javascript" src="http://api.csource.com.cn/index.php?dir=&file=jquery-3.3.1.min.js"></script>
<script type="text/javascript">var jQuery_New = $.noConflict(true);</script>
<!-- 加载jQuery1.6.2版本-->
<script type="text/javascript" src="http://api.csource.com.cn/index.php?dir=&file=jquery-1.6.2.min.js"></script>
<script type="text/javascript">var jQuery_1_6_2 = $.noConflict(true);</script>
<!-- 加载jQuery1.5.2版本-->
<script type="text/javascript" src="http://api.csource.com.cn/index.php?dir=&file=jquery-1.5.2.min.js"></script>
<script type="text/javascript">var jQuery_1_5_2 = $.noConflict(true);</script>
<!-- 加载jQuery1.4.2版本-->
<script type="text/javascript" src="http://api.csource.com.cn/index.php?dir=&file=jquery-1.4.2.min.js"></script>
<script type="text/javascript">var jQuery_1_4_2 = $.noConflict(true);</script>
<!-- 加载jQuery1.3.2版本-->
<script type="text/javascript" src="http://api.csource.com.cn/index.php?dir=&file=jquery-1.3.2.min.js"></script>
<script type="text/javascript">var jQuery_1_3_2 = $.noConflict(true);</script>
<!-- 测试效果 -->
<script type="text/javascript">
alert(jQuery_New.fn.jquery);
alert(jQuery_1_6_2.fn.jquery);
alert(jQuery_1_5_2.fn.jquery);
alert(jQuery_1_4_2.fn.jquery);
alert(jQuery_1_3_2.fn.jquery);
jQuery_New(function($){$('<p>我是最新的'+$.fn.jquery+'版本添加进来的。</p>').appendTo('body');});
jQuery_1_6_2(function($){$('<p>我是'+$.fn.jquery+'版本添加进来的。</p>').appendTo('body');});
jQuery_1_5_2(function($){$('<p>我是'+$.fn.jquery+'版本添加进来的。</p>').appendTo('body');});
jQuery_1_4_2(function($){$('<p>我是'+$.fn.jquery+'版本添加进来的。</p>').appendTo('body');});
jQuery_1_3_2(function($){$('<p>我是'+$.fn.jquery+'版本添加进来的。</p>').appendTo('body');});
</script>
</head>
<body>
在同一个页面中加载多个不同的jQuery版本
<br>
</body>
</html>文件所用jsquery均可在：http://api.csource.com.cn/ 获取
2 已被阅读了5528次 楼主 2019-01-22 09:11:12
