如何在页面上同时使用 jQuery 和其他框架?

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 is still working!");
});
});

您也可以创建自己的简写。noConflict() 可返回对 jQuery 的引用,您可以把它存入变量,以供稍后使用。请看这个例子:

var jq = $.noConflict();
jq(document).ready(function(){
jq("button").click(function(){
jq("p").text("jQuery is still working!");
});
});

如果你的 jQuery 代码块使用 $ 简写,并且您不愿意改变这个快捷方式,那么您可以把 $ 符号作为变量传递给 ready 方法。这样就可以在函数内使用 $ 符号了 - 而在函数外,依旧不得不使用 "jQuery":

$.noConflict();
jQuery(document).ready(function($){
$("button").click(function(){
$("p").text("jQuery is still working!");
});
});

参考:http://www.shouce.ren/api/view/a/12044

Jquery复习(九)之noConflict()的更多相关文章

  1. jQuery 复习

    jQuery 复习 基础知识 1, window.onload $(function(){});   $(document).ready(function(){}); 只执行函数体重的最后一个方法,事 ...

  2. Jquery 复习练习(01)

    Jquery 复习练习 window.onload = function() {} == $(function() {}); 千万注意:js对象和jq对象的区别,这也是常常犯的错误 js对象举例: w ...

  3. ②jquery复习

    # jQuery 复习--by 传智前端与移动开发学院 ## 1. jQuery是什么?(了解)+ www.github.com+ jQuery 其实就是一堆的js函数,是普通的js,只不过应用广泛, ...

  4. jquery源码中noConflict(防止$和jQuery的命名冲突)的实现原理

    jquery源码中noConflict(防止$和jQuery的命名冲突)的实现原理 最近在看jquery源码分析的视频教学,希望将视频中学到的知识用博客记录下来,更希望对有同样对jquery源码有困惑 ...

  5. jQuery的扩展与noConflict

    jQuery的扩展 noConflict

  6. 前端(jQuery)(6)-- jQuery的扩展与noConflict

    1.jQuery的扩展 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&qu ...

  7. jquery复习笔记

    Jquery基础 让一个按钮灰掉 $("button").("disabled","true"); ance desc选择器(ance代表祖 ...

  8. Jquery 复习练习(02)Javascript 与jquery 互转 onclick 与click区别

    Javascript 与jquery 互转 jquery 为<script src="jquery-1.8.3.js"></script> 以checkbo ...

  9. 2016/4/21 关于jquery复习

    jQuert AJAX [1]jQuery load()方法 :是AJAX方法, 从服务器加载数据,并把数据放入被选元素中 语法: $(selector).load(URL,data,callback ...

随机推荐

  1. SQL查询时踩得一些坑

    1.左右连接: left join:LEFT JOIN返回左表的全部行和右表满足ON条件的行,如果左表的行在右表中没有匹配,那么这一行右表中对应数据用NULL代替. inner join: 内连接是最 ...

  2. 【转】diamond专题(四)—— 容灾机制

    特别提示:本人博客部分有参考网络其他博客,但均是本人亲手编写过并验证通过.如发现博客有错误,请及时提出以免误导其他人,谢谢!欢迎转载,但记得标明文章出处:http://www.cnblogs.com/ ...

  3. LeetCode 49. 字母异位词分组(Group Anagrams)

    题目描述 给定一个字符串数组,将字母异位词组合在一起.字母异位词指字母相同,但排列不同的字符串. 示例: 输入: ["eat", "tea", "ta ...

  4. sonarqube修改自己的图像avatar

    https://community.sonarsource.com/t/how-can-i-change-my-avatar/11457/2 Hi, User icons are provided b ...

  5. java 设计模式 单例模式之饿汉模式/懒汉模式 singleton pattern

    https://v.qq.com/x/page/e0364ung5zp.html 讲的不错, 关于 饿汉式单例模式 code Student 类: package com.test;//单例模式之   ...

  6. IDEA超实用快捷键

    1.查看某个方法在哪里被调用了 Ctrl+G 2.从Controller跳过接口快速进入到实现类的方法: Ctrl+T 3.快速打开:Generate Alt+Insert 4.生成包裹代码: Ctr ...

  7. java连接oracle并load sql从xml执行查询

    在ETL的时候,连接oracle并load sql执行是基础操作,需要注意的是记得执行结束后记得关闭connection, 现记录一下: 其中xml文件: <?xml version=" ...

  8. 90子集II

    题目:给定一个可能包含重复元素的整数数组 nums,返回该数组所有可能的子集(幂集).说明:解集不能包含重复的子集. 输入:[1,2,2]   输出:[[2],[1],[1,2,2],[2,2],[1 ...

  9. 安装MySQL Enterprise Monitor

    MySQL Enterprise Monitor是专门为MySQL数据库而设计的一款企业级监控,能非常好地与MySQL各方面特性相结合,包括:MySQL的关键性能指标.主机.磁 盘.备份.新特性相关以 ...

  10. Dojo入门:初识Dojo

      Dojo的全称是Dojo Toolkit,始创于2004年,是当前各种蓬勃发展的JS工具包中的佼佼者.Dojo 为富互联网应用程序(RIA) 的开发提供了完整的端到端的解决方案,包括核心的 Jav ...