`
hred
  • 浏览: 44845 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

jQuery 与 prototype 共存

    博客分类:
  • Ajax
阅读更多
方式一:
 
<html>
 <head>
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script>
     jQuery.noConflict();
     
     // Use jQuery via jQuery(...)
     jQuery(document).ready(function(){
       jQuery("div").hide();
     });
     
     // Use Prototype with $(...), etc.
     $('someid').style.display = 'none';
   </script>
 </head>
 <body></body>
 </html>

方式二:
<html>
 <head>
   <script src="prototype.js"></script>
   <script src="jquery.js"></script>
   <script>
     var $j = jQuery.noConflict();
     
     // Use jQuery via $j(...)
     $j(document).ready(function(){
       $j("div").hide();
     });
     
     // Use Prototype with $(...), etc.
     $('someid').style.display = 'none';
   </script>
 </head>
 <body></body>
 </html>

方式三:
<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').style.display = 'none';
   </script>
 </head>
 <body></body>
 </html>
分享到:
评论
2 楼 jindw 2007-04-10  
JSI的解决方法:<br/>
<br/>
1。不同脚本中使用。分别申明依赖即是,不会冲突:<br/>
<br/>
<br/>
2。页面上直接使用<br/>
<br/>
<br/>
<div class='code_title'>js 代码</div>
<div class='dp-highlighter'>
<div class='bar'> </div>
<ol class='dp-c' start='1'>
    <li class='alt'><span><span>&lt;html&gt;    </span></span></li>
    <li class=''><span>&lt;head&gt;    </span></li>
    <li class='alt'><span>&lt;script src=<span class='string'>"boot.js"</span><span>&gt;&lt;/script&gt;    </span></span></li>
    <li class=''><span>&lt;script&gt;  </span></li>
    <li class='alt'><span><span class='keyword'>var</span><span> $j = $</span><span class='keyword'>import</span><span>(</span><span class='string'>"org.jquery.$"</span><span>);  </span></span></li>
    <li class=''><span><span class='keyword'>var</span><span> $p= $</span><span class='keyword'>import</span><span>(</span><span class='string'>"net.nioc.prototype.$"</span><span>);  </span></span></li>
    <li class='alt'><span>  </span></li>
    <li class=''><span><span class='comment'>//Use jQuery via $j(...)  </span><span>  </span></span></li>
    <li class='alt'><span>$j(document).ready(<span class='keyword'>function</span><span>(){    </span></span></li>
    <li class=''><span>       $j(<span class='string'>"div"</span><span>).hide();    </span></span></li>
    <li class='alt'><span> });   </span></li>
    <li class=''><span>  </span></li>
    <li class='alt'><span><span class='comment'>// Use Prototype with $p(...), etc.  </span><span>  </span></span></li>
    <li class=''><span>$p('someid').style.display = 'none';    </span></li>
    <li class='alt'><span>  </span></li>
    <li class=''><span>&lt;/script&gt;    </span></li>
    <li class='alt'><span>&lt;/head&gt;    </span></li>
    <li class=''><span>&lt;body&gt;&lt;/body&gt;    </span></li>
    <li class='alt'><span>&lt;/html&gt;    </span></li>
</ol>
</div>
1 楼 catoc 2007-04-09  
我使用的是 $j ,下一步计划逐步的将 prototype 的代码逐渐移除,
没有 namespace 总感觉不太好。

相关推荐

    JRails 支持jquery-ui 1.5.1 jQuery1.6

    也支持JQuery与Prototypea共存,方法如下: 1、将jquery.js放到prototype.js后面(这个是必须的否则无论如何还是要罢工地)。 2、在jquery.js后面将$变量重命名。 方法如下: [复制此代码]CODE: ...

    jquery学习必备代码和技巧

    学习jQuery 必备的一些代码和方法,相信学习了本文,你可以对jQuery的学习更加容易。...2. 解决jQuery, prototype共存,$全局变量冲突问题: &lt;script src="prototype.js"&gt;&lt;/script&gt; &lt;script

    解析jQuery与其它js(Prototype)库兼容共存

    一、在运行这个函数后,可以恢复使用别名 $ ,在这个函数的作用域中仍然将 $ 作为 jQuery 的别名来使用。jQuery Code: 代码如下:jQuery.noConflict();(function($) { $(function() { // 使用 $ 作为 jQuery 别名...

    ecshop解决jquery冲突js

    然而,在实际应用中,由于各种第三方插件和库的引入,可能会出现JavaScript库之间的冲突,尤其是当JQuery与其他使用$符号作为主要作用域的库(如Prototype或MooTools)同时存在时。标题中的"ecshop解决jquery冲突js...

    prototype 开发应用手册,笔记,prototype.js文件下载

    学习Prototype开发应用手册,你还可以掌握到 Prototype 如何与其他库(如jQuery、MooTools等)共存的策略,以及如何有效地利用Prototype进行模块化开发。同时,通过阅读源码,开发者可以深入理解其内部机制,提升...

    jQuery中文入门教程

    在压缩包中,出现了"prototype.js",这表明教程可能涉及jQuery与Prototype库的共存问题。在使用jQuery时,通常需要考虑与其他库的兼容性,可以通过`$.noConflict()`方法来释放jQuery的 `$` 符号,避免与其它库冲突。...

    jQuery 1.8.0 API 中文手册

    jQuery 插件通常是扩展其功能的一种方式,通过 `.extend()` 方法可以将新功能添加到jQuery对象或$.fn(即jQuery.prototype)上,使它们成为可链式调用的方法。 **性能优化** 1. **$(document).ready()**: 页面加载...

    JQuery in Action

    - jQuery与 Prototype、MooTools等其他JavaScript库的共存策略。 - jQuery与AngularJS、React等现代前端框架的配合使用。 4. **性能优化** - 减少DOM操作次数以提升性能。 - 使用事件代理提高事件处理效率。 -...

    Head First jQuery中文版

    7. **jQuery与其他库的共存**:学习如何在使用jQuery的同时,兼容其他JavaScript库,如Prototype或 MooTools,了解$.noConflict()的作用。 8. **性能优化**:理解DOM操作和动画对页面性能的影响,学习最佳实践以...

    ajax 框架 prototype

    标题提到的是"ajax框架prototype",而描述则涉及到对Prototype和jQuery的比较以及两者共存的问题。 Prototype是最早的JavaScript库之一,它以强大的DOM操作和类系统著称。Prototype的核心是其对JavaScript原生对象...

    jQuery高级程序设计目录1

    多库共存是一个实际开发中常见的情况,jQuery通过$.noConflict()方法可以释放$符号,允许与其他库如 Prototype 共存。 在第二章,我们关注jQuery的核心机制。"无new构建"意味着可以通过不使用new关键字创建jQuery...

    解决其他js和jquery冲突方法

    在使用 jQuery 开发时,可能还会遇到其他问题,例如如何正确地使用 jQuery 库,如何避免与其他库的冲突等。解决这些问题需要对 jQuery 库有深入的了解,並掌握一定的编程技巧。 在实际开发中,可能还需要使用到其他...

    jquery 基础学习资料

    7. **jQuery与其他库的兼容**:介绍如何在已有JavaScript代码基础上集成jQuery,以及与其他库如Prototype、MooTools的共存策略。 通过结合这两个资源,学习者不仅可以理解jQuery的基本概念,还能进一步掌握实际项目...

    prototype-1.6.0.2

    例如,`$` 函数是 Prototype 最著名的功能之一,用于选择页面上的元素,类似于 jQuery 中的 `$`。此外,它还提供了一套强大的事件处理机制,使得处理用户交互变得更加简单。 在 `prototype-1.6.0.2.js` 文件中,你...

    《jquery.基础教程》源代码

    6. **jQuery与其他库的兼容性**:jQuery通常与其他JavaScript库如Prototype、MooTools等能良好共存,通过使用$.noConflict()方法可以避免命名空间冲突。 7. **jQuery插件**:jQuery拥有丰富的插件生态系统,如...

    prototype的ajax应用

    尽管Prototype提供了自己的DOM操作和事件处理,但也可以与其他库如jQuery、MooTools等共存,只要正确管理命名空间。 综上所述,Prototype库的AJAX应用提供了一套全面且易于使用的工具集,简化了Web开发中涉及的...

    Manning.jQuery.in.Action.Feb.2008.pdf

    8. **jQuery与其他库的共存**:讲解如何在使用jQuery的同时与其他JavaScript库(如Prototype或MooTools)和平共处,避免命名冲突和资源浪费。 9. **jQuery生态**:介绍jQuery相关的工具和资源,如jQuery UI、jQuery...

    jQuery基础知识的电子书

    由于jQuery使用了 `$` 符号作为主要接口,如果与其他使用同一体系的库(如Prototype)一起使用,可能产生冲突。jQuery提供了`$.noConflict()`方法来解决这个问题。 ### 9. jQuery版本选择 jQuery有轻量级的“slim...

    jQuery实战

    **五、jQuery与其他库的共存** jQuery的`.noConflict()` 方法允许在同一个页面上使用多个JavaScript库,防止命名冲突。这在需要结合其他JavaScript库(如Prototype、YUI等)时非常有用。 总结,"jQuery实战"教程会...

Global site tag (gtag.js) - Google Analytics