在同一个页面使用多个不同的jQuery版本,让它们并存而不冲突
-
jQuery自诞生以来,版本越来越多,而且jQuery官网的新版本还在不断的更新和发布中,现已经达到了1.6.4版本,但是我们在以前的项目中就已经使用了旧版本的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://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
<script type="text/javascript">
var jQuery_New = $.noConflict(true);
</script>
<!-- 加载jQuery1.6.2版本 -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
var jQuery_1_6_2 = $.noConflict(true);
</script>
<!-- 加载jQuery1.5.2版本 -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript">
var jQuery_1_5_2 = $.noConflict(true);
</script>
<!-- 加载jQuery1.4.2版本 -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
var jQuery_1_4_2 = $.noConflict(true);
</script>
<!-- 加载jQuery1.3.2版本 -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.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>
转自:http://www.cnblogs.com/liyunqi007/archive/2011/10/22/2221178.html
在同一个页面使用多个不同的jQuery版本,让它们并存而不冲突的更多相关文章
- asp.net mvc jqgrid 同一个页面查询不同的表,jqgrid显示不同表的表头和数据并且分页
基于我上一篇文章<a href="http://www.cnblogs.com/alasai/p/4765756.html">asp.net mvc excel导入&l ...
- 自己改写了一个图片局部放大的jquery插件页面里面的html代码少了,同一个页面可以调用多个
自己改写了一个图片局部放大的jquery插件页面里面的html代码少了,同一个页面可以调用多个,兼容ie8以上浏览器,别忘了引用jquery,我用的jquery/1.11.0/其他版本没有测试,另外需 ...
- 完美实现在同一个页面中使用不同样式的artDialog样式
偶然发现artDialog.js这个插件,就被其优雅的设计及漂亮的效果深深吸引,在做例子时碰到了一些想当然它应该提供但却没有提供的功能,不过这都不影响我对它的喜爱,下面说一下遇到的问题吧! artDi ...
- 多个测试类 只使用同一个浏览器,同一个driver对象, 或者同一个页面的对象
如果是:多个测试类 只使用同一个浏览器,同一个driver对象, 或者同一个页面的对象,只需要:1. 创建一个基本的测试类(BaseTest),具有一个公共静态的driver属性, public st ...
- vue通过ID(参数)修改URL复用同一个页面(组件)不重新加载的问题
项目中经常会用到同一个页面,结构是相同的,我只是在vue-router中通过添加参数的方式来区分状态,参数可以在页面跳转时带上params,或者query,但是有一个问题,即使我们修改了参数,URL也 ...
- 系统管理模块_岗位管理_改进_使用ModelDroven方案_套用美工写好的页面效果_添加功能与修改功能使用同一个页面
改进_使用ModelDroven方案 @Controller @Scope("prototype") public class RoleAction extends ActionS ...
- vue 常见的新增、编辑、查看公用同一个页面
用vue开发经常会碰到,一个功能的新增.编辑.查看公用同一个页面,如果是页面暂且不提. 但是弹框,很多人会发现,如果是点击编辑,取消,再点新增,弹框上面是会有残留数据的,为什么会这样呢,因为在点编辑的 ...
- 同一个页面多个html、body标签
同一个页面多个html.body标签 html页面的一些标签,默认只有一个.比如html,head,body..... 如果写多个是什么情况呢.本着好奇的想法,试验了一下. <html> ...
- 在同一个页面多次调用el-select选择器
elementui是一个十分好用的组件库,但毕竟也不能做到面面俱到,有些还是要根据根据自己的实际需求做一些自定义的方法. 比如el-select选择器在同一个页面使用多次的话就会造成选择一个另一个也会 ...
随机推荐
- 我的WCF Data Service 系列 (一、为什么要有WCF Data Service)
开篇先说两名题外话, 在博问上,经常看到有个问性能问题,比如Entity Framework的性能行不行啊之类的. 其实这个行不行,关键还是看对象,一夜家族的老七可能勉强吃点蓝片片,也就行了,可真要让 ...
- 什么是linux的ftp
vsftpd是一款在Linux发行版中最受推崇的FTP服务器程序.特点是小巧轻快,安全易用.并且是一个完全免费开放源码的ftp软件ftp的作用: FTP(File Transfer Protocol, ...
- centos6.5编译安装git
1.下载高版本的git,地址:https://github.com/git/git/release,选择git-2.9.3.tar.gz 2.安装依赖包.解压.编译安装 yum install cur ...
- windows命令关机
不知道为啥,远程连接的window服务器没有关机命令,感觉是不是管理员权限导致的,所以找了下用命令关机,如下 shutdown -s -t #5秒内关机 shutdown -r -t #5秒内重启
- 安装php时的配置选项
./configure --prefix=/home/samba/anthony/web --enable-mbstring --enable-fastcgi --enable-fpm --with- ...
- Ecshop 单选按钮组功能 颜色多选
效果: js代码: function changeAtt(t,src,key) { document.getElementById('spec_value_'+src).checked='checke ...
- 【原】Gradle调用shell脚本和python脚本并传参
最近由于项目自动化构建的需要,研究了下gradle调用脚本并传参的用法,在此作个总结. Pre build.gradle中定义了$jenkinsJobName $jenkinsBuild两个Jenki ...
- Robot Framework--02 菜单栏&工具栏
转自:http://blog.csdn.net/tulituqi/article/details/7584795 我把RIDE的界面大致分了四个区域:菜单栏.工具栏.案例及资源区.工作区,如下图 菜单 ...
- php Hash Table(一) Hash Table的结构
关于Hash Table专题: 一直想深入理解一下php的hash table的实现,以前一直是星星点点的看看,从未彻底的总结过,那就从这个专题开始吧! 主要想总结几个部分:hashtable结构,h ...
- default配置
log_format main '$remote_addr - $remote_user [$time_local] $request ' '"$status" $body_byt ...