怎样让jQuery和其它js库共存

有时候需要同时使用jQuery和其它javascript，比如在joomla中默认的是motools，但很多人还是希 望能够使用jQuery，如果直接调用的话，由于两个库都使用了$作为简写，会造成程序冲突的情况，那么 ，怎样让jQuery和其它javascript库共存呢？有以下三种方法（均来自于官方网站）：

1.覆盖$ 函数，使用jQuery代替$

在jQuery和其它库已经加载之后，可以调用jQuery.noConflict ().

 
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script type="text/javascript"><!--
     jQuery.noConflict();
 
     // Use jQuery via jQuery(...)
     jQuery(document).ready(function(){
       jQuery("div").hide();
     });
 
     // Use Prototype with $(...), etc.
     $('someid').hide();
 
// --></script>
 
 
 
 

这样会使$恢复到原始库，在下面的代码中使用"jQuery"，而不是"$"

2.使用简称来代替 $

 
 
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script type="text/javascript"><!--
     var $j = jQuery.noConflict();
 
     // Use jQuery via $j(...)
     $j(document).ready(function(){
       $j("div").hide();
     });
 
     // Use Prototype with $(...), etc.
     $('someid').hide();
 
// --></script>
 
 
 

这样的话相当于$j代替$，是比较接近的一种用法了，当然可以使用其它自己喜欢的字符，比如 $J,$jq等等。

3.希望保留$

如果确实希望保留$而不是使用其它名称来代替，还有一种方 法。

 <html>
 <head>
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script>
     jQuery.noConflict();
 
     // Put all your code in your document ready area
     jQuery(document).ready(function($){
       // Do jQuery stuff using $
       $("div").hide();
     });
 
     // Use Prototype with $(...), etc.
     $('someid').hide();
   </script>
 </head>
 <body></body>
 </html>

怎样让jQuery和其它js库共存的更多相关文章

  1. jQuery与其他JS库共存

    * 事件 * jQuery与其他JS库共存 * 调用jQuery.noConflict()方法 * 表示jQuery将"$"符号的使用权交出 * 通过两种方式将"$&qu ...

  2. jQuery与其他JS库冲突解决

    实际开发中遇到JQuery与其他js库起冲突 究其原因,是它们的全局对象定义冲突了,特别是变量”$”, 可重载$函数.使用jQuery.noConflict()就可以通过重载$函数 例:项目中应用的 ...

  3. jquery 之事件 多库共存(noConflict)

    /*jquery 之 简单事件jquery 与其它库共存,提供了 .noConflict() 方法,用法如下<script src="jquery 库"><scr ...

  4. jQuery与其它js库共用

    <script src="js/zepto.min.js"></script>//其它js库<script src="http://comm ...

  5. 解决jQuery多个版本，与其他js库冲突方法

    jQuery多个版本或和其他js库冲突主要是常用的$符号的问题,这个问题 jquery早早就有给我们预留处理方法了,下面一起来看看解决办法. 1.同一页面jQuery多个版本或冲突解决方法. < ...

  6. 解决同一页面jQuery多个版本或和其他js库冲突方法

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  7. 在easyUI开发中，出现jquery.easyui.min.js函数库问题

    easyUI是jquery的一个插件,是民间的插件.easyUI使用起来很方便,里面有网页制作的最重要的三大方块:javascript代码.html代码和Css样式.我们在导入easyUI库后,可以直 ...

  8. 从零开始学 Web 之 jQuery（八）each，多库共存，包装集，插件

    大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...

  9. jQuery多库共存问题解决方法

    一.问题概述: 1.随着jQuery的流行,采用jQuery和$符为命名空间的js库越来越多,当然jQuery的$符也是参照的Prototype库的,所以当多个库同时以$符或者jQuery为命名空间时 ...

随机推荐

  1. Linq 入门 顺带 Func与Action

    Linq的优点: 查询是一种从数据源检索数据的表达式. 查询通常用专门的查询语言来表示. 随着时间的推移,人们已经为各种数据源开发了不同的语言:例如,用于关系数据库的 SQL 和用于 XML 的 XQ ...

  2. 11．PHP 教程_PHP Switch 语句

    switch 语句用于根据多个不同条件执行不同动作. PHP Switch 语句 如果您希望有选择地执行若干代码块之一,请使用 switch 语句. 语法 switch (n) { case labe ...

  3. js面向对象的三大特性

    0x00:使用OOP技术,常常要使用许多的代码模块,每个模块都提供特定的功能,每个模块老师孤立的,甚至与其它的模块完全独立,这种模块化的编程方法大大的提供了代码实现的多样性,大大增加了代码的重用性.j ...

  4. Google日历添加农历、节日和天气插件（步骤）

    Google日历添加农历.节日和天气插件(步骤) Google功能非常多,Google日历只是其中一个,而且支持Exchange账户(iPhone,WP7,诺基亚等)和Google账户登录(andro ...

  5. 面试题：对一个正整数n，算得到1需要的最少操作次数

    实现一个函数,对一个正整数n,算得到1需要的最少操作次数.操作规则为:如果n为偶数,将其除以2:如果n为奇数,可以加1或减1:一直处理下去.例子:func(7) = 4,可以证明最少需要4次运算n = ...

  6. 【PAT】1009. Product of Polynomials (25)

    题目链接:http://pat.zju.edu.cn/contests/pat-a-practise/1009 分析:简单题.相乘时指数相加,系数相乘即可,输出时按指数从高到低的顺序.注意点:多项式相 ...

  7. 用 jQuery Masonry 插件创建瀑布流式的页面

    瀑布流式的页面,最早我是在国外的一个叫 Pinterest 的网站上看到,这个网站爆发,后来国内的很多网站也使用了这种瀑布流方式来展示页面(我不太喜欢瀑布流这个名字). 我们可以使用 jQuery 的 ...

  8. Ext JS学习第九天 Ext基础之 扩展原生的javascript对象

    此文来记录学习笔记: •Ext对于原生的javascript对象进行了一系列的扩展,我们把他们掌握好,更能深刻的体会Ext的架构,从而对我们的web开发更好的服务, 源码位置,我们可以从开发包的这个位 ...

  9. oracle修改数据库语言

    alter session set nls_language = 'simplified chinese'; alter session set nls_language = 'american'; ...

  10. HTML5 画布参考

    描述 HTML5 <canvas> 标签用于绘制图像(通过脚本,通常是 JavaScript). 不过,<canvas> 元素本身并没有绘制能力(它仅仅是图形的容器) - 您必 ...