在写项目的过程中,如果需要使用jQuery时,时长会遇到需要引入不同版本的jQuery,可能上一个负责该项目的人用到的是老版本的jQuery,而你去添加功能时用的是新版本的,这个问题很难避免掉,如果去改代码,可能会浪费很长的时间,下面说一下我的解决方法。

1、在html页面,引入两个不同版本的 jQuery(低版本在前,高版本在后)

<script type="text/javascript" src="http://libs.baidu.com/jquery/1.10.0/jquery.min.js"></script>
<script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

2、输出jQuery 版本号

<script type="text/javascript">
$(function(){
var version = $.fn.jquery ;
console.info(version);
document.write("jQuery版本是: " + version);
});
</script>

此时的版本号是2.0.0;

3、对调jQuery版本引入顺序 (高版本在前,低版本在后)

<script type="text/javascript" src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript" src="http://libs.baidu.com/jquery/1.10.0/jquery.min.js"></script>

使用 2中方法,再次输出jQuery版本号: jQuery版本是: 1.10.0;

4、结论: 通过调整 jQuery的引入顺序,无法解决不同版本jQuery共存的问题。 最终获得的jQuery对象是最后加载的那一个。

5、解决问题

使用 noConflict() 方法实现jq版本共存;

$(function(){
var $2 = $.noConflict(); // 第二个加载的jQuery对象变成了 $2
var version = $.fn.jquery ;
var version2 = $2.fn.jquery ;
console.info(version , version2);
document.write("jQuery版本是: " + version + "jQuery2版本是: " + version2);
});

这时,两个版本就可以共存了;

项目中同一个页面引入不同的jQuery版本的不冲突问题的更多相关文章

  1. web项目中实现页面跳转的两种方式

    <a href="javascript:"></a>跳转在网页本身,URL不改变 <a href="#"></a> ...

  2. 怎么查看CI,codeigniter的版本信息?想看某个项目中使用的CI具体是哪个版本,怎么查看?

    怎么查看CI的版本信息?想看某个项目中使用的CI具体是哪个版本,怎么查看?system\core\codeigniter.php中可以查看版本常量/** * CodeIgniter Version * ...

  3. 记录---java中jsp页面引入jquery路径的问题

    今天在jsp页面中引入jquery的时候因为路径不对总是报404,网上的方法找到几种试了试但是最后结果还是不生效,遂想起原先的项目中有引入外部jquery的例子,所以立马看了看,发现当时的项目中是用$ ...

  4. vue-cli项目中,全局引入jquery

    命令行执行 npm install --save jquery 找到webpack.base.conf.js文件,写入代码: const webpack = require('webpack') 在m ...

  5. Vue编写的页面部署到springboot网站项目中出现页面加载不全问题

    问题描述: 在用Vue脚手架 编写出一个页面之后, 部署到后台项目中, 因为做的是一个页面 按理来说 怎么都能够在服务器上运行 , 我也在自己的node环境测试 , 在同学的springboot上运行 ...

  6. creat-react-app搭建的项目中按需引入antd以及配置Less和如何修改antd的主题色

    在creat-react-app搭建的项目环境中按需引入antd以及配置less,首先需要暴露出来webpack文件.(此操作不可逆). create-react-app myapp 创建同一个rea ...

  7. 夺命雷公狗---node.js---19之项目的构建在node+express+mongo的博客项目4mongodb在项目中的基本引入

    首先我们在命令行下先建立这个库: 然后我们在项目中引入mongodb的模块: var MongoClient = require('mongodb').MongoClient; var DB_STR ...

  8. vue项目中设置全局引入scss,使每个组件都可以使用变量

    在Vue项目中使用scss,如果写了一套完整的有变量的scss文件.那么就需要全局引入,这样在每个组件中使用. 可以在mian.js全局引入,下面是使用方法. 1: 安装node-sass.sass- ...

  9. Vue-Cli 3.x 创建的项目中对 import 引入的 CSS 样式启用 autoprefixer

    问题描述: Vue-Cli 3.x 默认开启了 autoprefixer,但对于在 main.js 中通过 import 引入的 CSS 并没有自动添加前缀 分析原因: autoprefixer 在项 ...

随机推荐

  1. 20200513_安装windows sql server 2012 _ ws功能 NetFx3时出错,错误代码:-2146498298

    这是没有安装.net Framework 3.5造成的 1. 下载个.net Framework 3.5, 放到任意目录下, 比如C: 2. 打开添加windows 功能 3. 直接下一步: 4. 勾 ...

  2. Fiddler 4 断点调试(修改request请求参数)

    1.选中要测试的链接 2然后点击规则的Automatic Breakpoints 的Before Requests 3.重新发送请求找到测试的点链接 最终效果如下

  3. 老猿学5G扫盲贴:中国移动网络侧CHF主要功能及计费处理的主要过程

    专栏:Python基础教程目录 专栏:使用PyQt开发图形界面Python应用 专栏:PyQt+moviepy音视频剪辑实战 专栏:PyQt入门学习 老猿Python博文目录 老猿学5G博文目录 一. ...

  4. 第三十九章、PyQt显示部件:OpenGL Widget部件功能简介及使用其显示图片

    专栏:Python基础教程目录 专栏:使用PyQt开发图形界面Python应用 专栏:PyQt入门学习 老猿Python博文目录 老猿学5G博文目录 一.概述 OpenGL Widget部件是一个Op ...

  5. PyQt(Python+Qt)学习随笔:QCommandLinkButton的特征及用途

    CommandLinkButton是Windows Vista引入的新控件,,它的预期用途与单选按钮类似,用于在一组互斥选项之间进行选择.命令链接按钮不应单独使用,而应作为向导和对话框中单选按钮的替代 ...

  6. PyQt(Python+Qt)学习随笔:在父窗口中弹出子窗口无法显现的问题

    在学习和测试PyQt相关部件功能的时候,老猿经常是不同的窗口新建一个类,再新建一个Application来使用这个窗口类进行测试. 为了减少应用框架代码的重复开发,老猿决定采用主窗口叠加测试窗口的模式 ...

  7. SSH无密码登陆

    http://blog.chinaunix.net/uid-26284395-id-2949145.html

  8. 用STM32定时器测量信号频率——测频法和测周法[原创cnblogs.com/helesheng]

    工业测试与控制系统中,经常需要对未知信号的频率进行测试.对于10MHz以下的信号,用单片机(MCU)定时器完成这项任务显然是最常见和最佳的选择.目前性价比最高的单片机STM32拥有功能强大且数量众多的 ...

  9. Markdown 公式指导手册

    本文为 Markdown 环境下的常用语法指引.Typora 编辑阅读器支持 \(\LaTeX\) 编辑显示支持,例如:\(\sum_{i=1}^n a_i=0\),访问 MathJax 以参考更多使 ...

  10. Unity发布WebGL改变鼠标样式

    记录:前段时间遇到一个需求,就是打包出来要在某种情况下鼠标的样子要改变成想要的样式. 详细代码如下 public Texture2D[] hand;//小指图标 /// <summary> ...