jQuery中 noConflict() 方法使用


Posted in Javascript onApril 25, 2013

jQuery 和其他 JavaScript 框架
正如您已经了解到的,jQuery 使用 $ 符号作为 jQuery 的简写。

如果其他 JavaScript 框架也使用 $ 符号作为简写怎么办?

其他一些 JavaScript 框架包括:MooTools、Backbone、Sammy、Cappuccino、Knockout、JavaScript MVC、Google Web Toolkit、Google Closure、Ember、Batman 以及 Ext JS。

其中某些框架也使用 $ 符号作为简写(就像 jQuery),如果您在用的两种不同的框架正在使用相同的简写符号,有可能导致脚本停止运行。

jQuery 的团队考虑到了这个问题,并实现了 noConflict() 方法。

jQuery noConflict() 方法
noConflict() 方法会释放会 $ 标识符的控制,这样其他脚本就可以使用它了。

实例
当然,您仍然可以通过全名替代简写的方式来使用 jQuery:

$.noConflict();
jQuery(document).ready(function(){
  jQuery("button").click(function(){
    jQuery("p").text("jQuery 仍在运行!");
  });
});

实例
您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用,您可以把它存入变量,以供稍后使用。请看这个例子:
var jq = $.noConflict();
jq(document).ready(function(){
  jq("button").click(function(){
    jq("p").text("jQuery 仍在运行!");
  });
});

实例
如果你的 jQuery 代码块使用 $ 简写,并且您不愿意改变这个快捷方式,那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外,依旧不得不使用 "jQuery":
$.noConflict();
jQuery(document).ready(function($){
  $("button").click(function(){
    $("p").text("jQuery 仍在运行!");
  });
});
Javascript 相关文章推荐
jquery的ajaxSubmit()异步上传图片并保存表单数据演示代码
Jun 04 Javascript
查找页面中所有类为test的结点的方法
Mar 28 Javascript
Node.js实现JS文件合并小工具
Feb 02 Javascript
AngularJS基础 ng-mousemove 指令简单示例
Aug 02 Javascript
JS获取填报扩展单元格控件的值的解决办法
Jul 14 Javascript
angular 用Observable实现异步调用的方法
Dec 27 Javascript
JavaScript继承的特性与实践应用深入详解
Dec 30 Javascript
vue2.0+vue-router构建一个简单的列表页的示例代码
Feb 13 Javascript
JavaScript Math对象和调试程序的方法分析
May 13 Javascript
Vue实战教程之仿肯德基宅急送App
Jul 19 Javascript
vue中实现回车键登录功能
Feb 19 Javascript
关于vue3默认把所有onSomething当作v-on事件绑定的思考
May 15 Javascript
只需20行代码就可以写出CSS覆盖率测试脚本
Apr 24 #Javascript
js Array对象的扩展函数代码
Apr 24 #Javascript
网页中返回顶部代码(多种方法)另附注释说明
Apr 24 #Javascript
onkeypress字符按键兼容所有浏览器使用介绍
Apr 24 #Javascript
纯JS实现五子棋游戏兼容各浏览器(附源码)
Apr 24 #Javascript
jquery仿京东导航/仿淘宝商城左侧分类导航下拉菜单效果
Apr 24 #Javascript
基于jQuery实现图片的前进与后退功能
Apr 24 #Javascript
You might like
PHP发明人谈MVC和网站设计架构 貌似他不支持php用mvc
2011/06/04 PHP
PHP用PDO如何封装简单易用的DB类详解
2017/07/30 PHP
PHP容器类的两种实现方式示例
2019/07/24 PHP
JS 自动完成 AutoComplete(Ajax 查询)
2009/07/07 Javascript
jquery中防刷IP流量软件影响统计的一点对策
2011/07/10 Javascript
基于jquery完美拖拽,可返回拖动轨迹
2012/03/29 Javascript
简单漂亮的js弹窗可自由拖拽且兼容大部分浏览器
2013/10/22 Javascript
简单理解JavaScript中的封装与继承特性
2016/03/19 Javascript
基于javascript实现精确到毫秒的倒计时限时抢购
2016/04/17 Javascript
纯javaScript、jQuery实现个性化图片轮播【推荐】
2017/01/08 Javascript
angular-cli修改端口号【angular2】
2017/04/19 Javascript
js实现图片懒加载效果
2017/07/17 Javascript
Angular利用内容投射向组件输入ngForOf模板的方法
2018/03/05 Javascript
详解如何快速配置webpack多入口脚手架
2018/12/28 Javascript
javascript实现异形滚动轮播
2019/11/28 Javascript
浅谈vue.watch的触发条件是什么
2020/11/07 Javascript
python编程线性回归代码示例
2017/12/07 Python
使用Python中的reduce()函数求积的实例
2019/06/28 Python
pycharm配置当鼠标悬停时快速提示方法参数
2019/07/31 Python
Python的条件锁与事件共享详解
2019/09/12 Python
Numpy将二维数组添加到空数组的实现
2019/12/05 Python
CSS3制作酷炫的条纹背景
2017/11/09 HTML / CSS
详解HTML5新增标签
2017/11/27 HTML / CSS
canvas离屏技术与放大镜实现代码示例
2018/08/31 HTML / CSS
澳大利亚领先的孕妇服装品牌:Mamaway
2018/08/14 全球购物
通用C#笔试题附答案
2016/11/26 面试题
大学校园生活自我鉴定
2014/01/13 职场文书
初三物理教学反思
2014/01/21 职场文书
你的创业计划书怎样才能打动风投
2014/02/06 职场文书
护理中职生求职信范文
2014/02/24 职场文书
建筑安全生产责任书
2014/07/22 职场文书
社区义诊通知
2015/04/24 职场文书
2015年度公共机构节能工作总结
2015/05/26 职场文书
电影建国大业观后感
2015/06/01 职场文书
教学副校长工作总结
2015/08/13 职场文书
HTML页面中使两个div并排显示的实现
2022/05/15 HTML / CSS