Angular1项目更新jQuery后$.fn.jquery显示旧版本求助

看起来你遇到的是典型的AngularJS 1.x与jQuery加载顺序/重复引用冲突问题，我帮你拆解下原因和具体解决步骤：

核心原因 #

AngularJS 1.x在初始化时，会检查window对象上是否存在jQuery（也就是$），如果有，就会把这个版本的jQuery绑定到自身的angular.element上。之后哪怕你再加载更高版本的jQuery，Angular内部也不会自动切换到新版本。而你控制台执行$.fn.jquery显示1.11.0，说明页面里肯定还存在旧版本的jQuery引用——要么是你没删掉之前的CDN链接，要么是某个第三方依赖偷偷引入了旧版本，而且它的加载顺序大概率在你的2.2.4版本之前。

具体解决步骤 #

1. 彻底清除重复的jQuery引用 #

• 打开你的index.html，把所有旧的jQuery引用（比如你提到的谷歌CDN链接）全部删除，只保留本地的jquery-2.2.4.min.js引用，别留任何漏网之鱼。
• 排查项目里的第三方依赖（比如AngularUI Bootstrap、自定义指令插件），有些插件会通过动态创建script标签或者包管理依赖（Bower/NPM）偷偷引入旧版本的jQuery，这时候需要去这些依赖的配置或源码里确认并清理。

2. 严格控制脚本加载顺序 #

• 把你的jQuery 2.2.4脚本放在所有脚本的最前面，尤其是要在AngularJS的脚本之前加载。正确的顺序应该是：

  <!-- 先加载目标版本的jQuery -->
  <script src="path/to/your/jquery-2.2.4.min.js"></script>
  <!-- 再加载AngularJS核心脚本 -->
  <script src="path/to/angular.min.js"></script>
  <!-- 最后加载其他依赖Angular或jQuery的插件/脚本 -->
  <script src="path/to/angular-ui-bootstrap.min.js"></script>
  

  这样Angular初始化时，就能精准拾取到你想要的jQuery版本，而不是旧版本。

3. 强制清除浏览器缓存 #

• 浏览器有时候会顽固缓存旧的脚本文件，哪怕你已经更新了引用。可以按Ctrl+Shift+R（Windows/Linux）或者Cmd+Shift+R（Mac）强制刷新页面，或者打开Chrome开发者工具的「Network」面板，勾选「Disable cache」后再刷新页面。

4. 验证Angular实际使用的版本 #

• 别只依赖控制台的$.fn.jquery（页面可能存在多个jQuery实例），要验证Angular内部绑定的版本，可以在你的Angular控制器里加这段代码：

  angular.module('yourAppName').controller('TestController', function($document) {
    console.log('Angular内部使用的jQuery版本:', $document[0].jQuery.fn.jquery);
  });
  

  或者直接在控制台执行：angular.element.fn.jquery，这才是Angular真正在用的版本。

5. 处理第三方依赖的旧jQuery #

• 如果是通过包管理工具（比如Bower、NPM）引入的依赖自带旧jQuery，可以尝试：
  • 更新依赖到支持jQuery 2.x的版本；
  • 在包管理配置里排除旧版本的jQuery，比如Bower可以在bower.json里用resolutions字段指定jQuery版本；
  • 手动替换依赖包里的jQuery引用为你的2.2.4版本。

内容的提问来源于stack exchange，提问作者vivek v