jquery gets a lot of its inspiration from the power behind the Prototype library. This is immediately noticeable with jquery's use of the $() function, inspired by the Prototype function of the same name. However, there are some things that should be known about the Prototype and jquery interact, and how the $() behaves differently.
Using Prototype and jquery Together
只要先引入prototype再引入
jquery,个人感觉就是作者自己说的,因为是Prototype给他灵感,所以重成了Prototype的部分内容,因此先
jquery必将出现我们所不知道的错误.
To include both Javascript libraries, and have them work in unison, you will need to first include Prototype, then jquery. For example:
<script src="prototype.js"></script>
<script src="http://jquery.com/src/latest/"></script>
Loading jquery first, then Prototype, will cause your code to break - as a reminder, jquery throws an exception saying: "You are overwriting jquery, please include jquery last." (If you see this error, that's what it means)
Differences in $()
A side-by-side comparison of how the $() function works *ONLY WHEN PROTOTYPE IS USED* would be best to explain the differences. If you're not using Prototype, please refer to the documentation, instead.
$("pre")
Prototype: Looks for the element with an ID of pre, if found, returns it, otherwise returns null.
jquery: Looks for all elements with the Tag name of pre.
- If none are found: It then looks for an element with an ID of pre, if one is found - it returns that element, if not, it returns a jquery object, with an empty set of matched elements.
- If elements are found: jquery returns a jquery object, containing the all matched pre elements.
$(DOMElement)
Prototype: Returns the DOMElement.
jquery: Attaches all of the jquery object methods to the DOMElement, then returns it. The result should still be usable by Prototype and jquery. Note: See the bottom of the page for more information on this.
What to do about $()?
Because the behavior of Prototype and jquery is different, when it comes to the $() function, it is recommended that you do one of two things:
Un-ambiguous Selectors
Always be explicit when you search by a single ID. For example, use this:
$("#pre")
and not this, which is ambiguous:
$("pre")
Doing that will solve any problems straight away.
Prototype Short-hand
If you want to continuing using the Prototype short-hand, you must keep one rule in mind: Never name any of your IDs the same as a DOM Element type, otherwise you will have strange results. For example:
$("pre")
would work, if there were no pre elements in the page, but once one was added, your code would break. A better example is:
$("body")
which will always break (since the body element is required).
In a nutshell: Either use smart un-ambiguous !IDs, or don't name your !IDs the same as element names.
Wrapping of DOM Elements
In order to support both Prototype and jquery users at the same time, returned DOM elements have additional jquery functions attached to them. It should be noted, however, that just because the original DOM Element is being returned, its original functions and properties should not be accessed directly, for example:
When using both Prototype and jquery $("wrap") will return a modified DOM Element, so if you were inclined to do:
$("wrap").style.display = 'none';
That would work, but only when using Prototype. If you then, later, stopped using Prototype, that code would break. To be safe, you should only use jquery-sanctioned functions and terminology, for example:
$("#wrap").hide();
would be the proper way of doing the above - it will always work, even if you are (or aren't) using Prototype.
Using Prototype and jquery Together (other solution)
If you need use jquery and also Prototype + Scriptaculous + ... , you need rename jquery $ function. For example:
<script src="http://jquery.com/src/latest/"></script>
<script type="text/javascript">
JQ = $; //rename $ function
</script>
<script src="prototype.js"></script>
Then you can access to jquery function with JQ and for access to Prototype $ function use the normal name. For example:
<script type="text/javascript">
JQ(document).ready(function(){
JQ("#test_jquery").html("this is jquery");
$("test_prototype").innerHTML="this is Prototype";
});
</script>
NOTE: Be carefull with jquery plugins, you will need rename all $ references to JQ or other name.
相关推荐
为了防止这些问题,服务器可能会在返回的JSON数据前添加一些不可执行的字符,例如`'[[Prototype]]'`。jQuery能够处理这种格式的JSON,确保数据的安全性。 总之,jQuery提供了方便的API来处理与后台交互时的JSON数据...
本文将详细探讨“jquery-calendar-with-tooltip_9月显示有误修复后”这个主题,它涉及到jQuery插件的开发、JavaScript编程以及日历控件的常见问题与修复策略。 首先,"jquery-calendar-with-tooltip"这个名字暗示这...
Spket是一款开源的JavaScript IDE和插件,它提供了对JavaScript、Dojo、Yahoo UI Library、Prototype、jQuery等框架的强大支持。Spket的主要特点是其智能代码提示功能,能够帮助开发者快速编写代码,减少错误,提高...
例如,可以创建两个数组,一个存放真心话问题,另一个存放大冒险任务,然后通过数组的`Math.random()`和`Array.prototype.slice()`等方法来随机选取元素。 4. **事件监听**:jQuery的`.on()`方法可以用来监听用户的...
3. JavaScript框架与库:如果`index.html`引用了JavaScript库或框架(如jQuery、Vue.js或Angular),那么原型可能包含动态交互元素,这有助于提升用户体验。 4. 构建工具:`dist`文件夹的存在表明代码可能经过了...
在“jquery-plugin-lab”中,你可以找到关于如何构建一个基本的jQuery插件的实例,这通常包括以下几个部分: 1. **命名空间**:为了防止命名冲突,一般会在$.fn(即jQuery.prototype)上添加一个新的方法,如`$.fn....
首先,我们要明白jQuery对象有一个`.fn`属性,它是`jQuery.prototype`的别名,这意味着我们可以在这个对象上添加方法,使其成为所有jQuery实例可用的公共方法。例如,如果我们想创建一个名为`myFunction`的自定义...
【某网站最新WEB前端应用及发展讲义】的讲义主要涵盖了淘宝网前端的发展历程、遇到的问题与挑战、实践经验以及对未来的展望。这份PPT文档资料由前端工程师赵泽欣(小马)分享,旨在探讨前端技术在淘宝网的应用和发展...
在JavaScript中,我们...重写jQuery对象的方法能够为我们解决一些特殊问题提供一种有效手段,但同时也需要注意代码的维护性和项目中其他成员的协作。在实际开发中,对于重写方法的使用,我们应当权衡利弊,合理取舍。
通过DWR调用服务器端的方法,然后使用Prototype来处理返回的数据并更新页面,可以实现高效的前后端协作。 ### 4. **学习资源与实践** 要深入理解DWR和Prototype,可以参考它们的官方文档、在线教程以及示例项目。...
在“WBS-Prototype”中,NPM用于管理项目依赖,使得开发者可以方便地引入和更新所需的各种第三方库,如jQuery、Lodash等,同时也方便团队成员共享和维护代码。 综上所述,“WBS-Prototype”项目管理系统原型利用了...
8. **版本控制**:JavaScript项目通常会用到Git进行版本控制,这有助于团队协作和跟踪代码变更,也适用于像prototype.io这样的WIP项目。 9. **测试和调试**:开发者可以利用浏览器的开发者工具对JavaScript代码进行...
- jQuery、Prototype、Dojo、YUI等库都提供了Ajax支持。 - Axios和Fetch API是现代JavaScript中的流行选择,尤其在Vue.js和React等前端框架中。 7. **Ajax与RESTful API** - RESTful API设计风格常用于构建Web...
9. **测试与反馈**:原型完成后,会进行用户测试,收集反馈并进行迭代,以确保最终设计满足用户需求和预期。 通过"mp-prototype"项目,我们可以学习到如何使用HTML创建网页结构,结合CSS和JavaScript实现交互,以及...
"prototype_project:我的原型" 这个标题表明这是一个关于原型设计的项目,可能是一个网页或应用程序的初期模型,旨在展示其基本功能和界面布局。"我的原型" 暗示这是个人或者团队独立完成的作品,可能是为了演示、...
GitHub上的项目往往遵循开放合作的模式,广泛使用的开源项目如Ruby on Rails、Hibernate、phpBB、jQuery、Prototype和Homebrew等都托管在GitHub上。注册用户超过百万,托管的版本库数量超过三百万。GitHub采用Git...
总的来说,“表格行列转置Demo”是一个结合了HTML、jQuery、JavaScript和Java技术的实用案例,展示了如何通过前后端协作实现动态数据操作。学习并理解这个示例,开发者可以提升自己的Web开发技能,特别是在数据展示...
1. **前端开发**:JavaScript是前端开发的核心技术之一,通常与HTML和CSS一起使用,构建网站的用户界面。它能够处理页面的动态行为,如表单验证、数据交换、动画效果等。 2. **网站原型设计**:在项目开发初期,...
【标题】"Soft166网站:PROTOTYPE" 指的是Soft166网站的原型版本,这通常是在一个项目开发初期为了测试和验证设计理念而创建的一个基本框架。在软件开发过程中,原型是一个功能不完全但能展示核心概念的模型,它允许...
4. **互操作性**:控件应当能与后端系统无缝协作,可能需要将选中的时间转换为ISO 8601格式(如"HH:mm:ss")或者其他服务器能理解的格式,以便进行数据交换。 5. **可配置性**:一个好的时间控件应该允许开发者定制...