jQuery 是一个简洁而快速的 JavaScript 库, 可用于简化事件处理, html 文档遍历, Ajax 交互和动画, 以便快速开发网站.
jQuery 设计的宗旨是 "write Less,Do More", 即倡导写更少的代码, 做更多的事情. 它封装 JavaScript 常用的功能代码, 提供一种简便的 JavaScript 设计模式, 优化 HTML 文档操作, 事件处理, 动画设计和 Ajax 交互.
jQuery 自 2006 年诞生以来, 一个发行了 1.x,2.x,3.x 这三个大版本, 而在这三个大版本下又细分了许多小版本.
那么 jQuery 不同版本冲突吗?
jQuery 不同版本会引发冲突. 那么怎么解决?
官方的解决方案就是 jQuery.noConflict(), 它的中文官方文档写的比较好, 不过可能你看完还是不太懂怎么用, 这里再通俗的解释一下.
使用方法
先看不用 jQuery.noConflict() 会有什么问题:
- <script src="jquery-1.7.js"></script>
- <script src="jquery-1.11.js"></script>
- <script>
- // 现在 Windows.$ 和 Windows.jQuery 是 1.11 版本:
- console.log($().jQuery); // => '1.11.0'
- // 接下来的所有代码和插件都只能基于 1.11 版本, 所有只兼容 1.7 版本的插件都直接挂掉
- </script>
- <script src="myscript.js"></script>
正确姿势:
- <script src="jquery-1.7.js"></script>
- <script src="jquery-1.11.js"></script>
- <script>
- // 现在 Windows.$ 和 Windows.jQuery 是 1.11 版本:
- console.log($().jQuery); // => '1.11.0'
- var __ = jQuery.noConflict(true);
- // 现在 Windows.$ 和 Windows.jQuery 被恢复成 1.7 版本, 只有__才代表 1.11 版本
- console.log($().jQuery); // => '1.7.0'
- // 可以通过 __ 访问 1.11 版本的 jQuery 了
- console.log(__.jQuery); // => '1.11.0'
- </script>
- <script src="myscript.js"></script>
原理
从上面代码就可以读懂 jQuery.noConflict() 的原理:
1, 既然 jq 两个版本先后加载, 就肯定只有一个生效, 通常肯定是让老版本在上, 新版本在下, 让新版本在后面生效.
2, 让生效的那个新版 jQ 做出一个让步, 给自己换个名字比如__, 然后把 $ 和 jQuery 变量名重新交给前一个老版 jQ.
3, 这样两个版本的 jQ 都有了自己的名字, 就可以并存了.
问题
虽然你写的代码可以用__, 但是别人基于 1.11 版本写的插件不认这个变量, 只认 jQuery 变量, 怎么解决呢?
1, 什么也不改, 直接先试试, 假如基于 1.11 的插件也可以基于 1.7, 那就省事了.
2, 万一不行, 只能是修改插件了, 由于插件都会用自执行函数包裹代码, 所以只需修改一处即可:
- (function ($) {
- // 代码体...
- })(jQuery);
将传入的 jQuery 改成__即可.
更多 web 前端开发 https://www.html.cn/ 知识, 请查阅 HTML 中文网 !!
来源: http://www.css88.com/qa/jquery/16895.html