引用
引用
对于任意的一个HTML节点之后加入一个任意的标记
In Prototype:
new Insertion.After(’myId’, ‘Arbitrary HTML’);
In jQuery:
$(’#myId’).after(’Arbitrary HTML’);
看起来,jQuery的代码确实比prototype.js的代码更“人性化”一些。当然,从可读性来讲,两者的可读性都是非常出色的。这就是我需要学习的地方-良好的代码就是自注释的。
造成代码风格的这种差异,其实是两个framework的开发者不同的代码哲学造成的。对于prototype来说,非常类似Java的处理方式: 将一系列的功能封装到一个类之中,比如Math类。而对于jQuery来说,其哲学理念是将所有的HTML节点都视为一个Object,通过调用这个 Object上面不同的方法向这个Object发送不同的消息,来让Object自己实现不同的功能,产生不同的表现。
而这篇文章的作者认为jQuery哲学更优秀的地方就在于将一个html node与各种functionality有机的结合在一起,使代码更优雅,而实现这种结合的正式jQuery中的$()函数;请注意,这个$()与 prototype.js中的$()有着本质的区别,查看过两个framework的document之后就会发现,jQuery中的$()可以根据复杂 的传入参数来返回一个或者一组html node,而这些查询条件是如此的复杂,甚至连css selector与xpath都被纳入了被支持的范围;而prototype.js的$()就显得有些小儿科,它只能返回一个单独的html node。
正式这个$()的不同,prototype.js引入了$$()这样的css selector来 弥补起对html node query的不足,但是似乎效果甚微,因为jQuery的这种将object与functionality粘连的理念深植在framework之中,成为 了近乎语法的一部分,而prototype还是脱离不了将html node单独作为一种特别的”材料“来进行操作,从如下的代码就可以看出:
向一组元素加入一个css class(Prototype):
$$('.element').each(function(node) {Element.addClassName(node, 'className');}
向一组元素加入一个css class(jQuery):
$('.element').addClass('className');
从上面的例子就可以看出来,是代码的哲学左右的框架的使用规则,prototype只能笨拙的使用为array attch的一个.each方法来进行元素的迭代,从而完成为每个元素加入一个css class的工作,而jQuery处理的似乎就漂亮的多,也似乎更有人情味一些,这就叫做优雅。
当然,所谓的优雅,其实不一定就更被推崇,因为这属于技术上的一种极端。两者的performance我并没有比较过,但是估计差别不会很大,或者说这种用优雅换来的性能差别并没有达到需要考虑的数量级。
Wycats的声音还没落,EncyteMeida的另一篇Post就开始应战了,大声呼吁Wycats在misleading各位Developer,并且将Wycats数出来 的jQuery的优点都数落了一番,还像模像样的给出了例证:
谁说prototype.js没有这样的语法?
Element.addMethods({ insertionBefore: function(element, content) { new Insertion.Before(element, content); }, insertionAfter: function(element, content) { new Insertion.After(element, content); }, insertionTop: function(element, content) { new Insertion.Top(element, content); }, insertionBottom: function(element, content) { new Insertion.Bottom(element, content); } }); $("item-1").insertionBefore("<li>Sweet</li>");
谁说prototype.js没有auto looping?
$$('span').invoke("addClassName", 'omg');
甚至还数落了jQuery的.js文件短小精悍是使用字母表中的’a,b,c’等字母作为变量命名换来的等等……
真有意思,技术界整天都在展开宗教战争,就像当初Java Vs .Net一样,其实根本就不存在哪个更好哪个更强的说法,只是我们都在欣赏一次次技术大牛们的战争中慢慢成长起来,学会了更多的东西而已,希望技术界天天打仗!
分享到:
相关推荐
**Prototype与jQuery的对比** 1. **易用性**:jQuery以其简洁的语法和丰富的API赢得了开发者的心,而Prototype则相对较复杂。 2. **性能**:虽然两者在性能上都有优化,但jQuery在某些场景下表现更优。 3. **社区...
- **与 jQuery 的对比**: Prototype.js 和 jQuery 都是流行的 JavaScript 库,它们在功能上有一定的重叠,但在设计哲学和使用方式上有所不同。例如,jQuery 更注重简洁性,而 Prototype.js 则更侧重于扩展 ...
jQuery与Prototype框架详细对比分析: 1. DOM加载及ready方法: 在jQuery中,开发者可以利用$(document).ready(function(){});这一语法结构来确保在DOM完全加载后执行函数。这种机制对确保事件处理器正确绑定到DOM...
**三、jQuery与Prototype的对比** 1. **易用性**: jQuery以其简洁的API和链式调用,通常被认为比Prototype更容易上手。 2. **社区支持**: 相较于Prototype,jQuery拥有更大的社区和更多的插件,开发者可以找到更多...
jQuery像Ruby一样简洁快速灵活,与prototype(类似Java)形成对比。 2. jQuery特点:它是一个轻量级的脚本,最新版的JavaScript包只有大约20K大小;支持CSS1~CSS3和基本的XPath;是一个跨浏览器的框架,支持包括IE...
"JavaScript框架jQuery和ExtJS的对比研究" 本文将对JavaScript框架jQuery和ExtJS进行对比研究,旨在帮助Web开发者选择合适的JavaScript框架。 JavaScript框架的重要性 随着Web 2.0时代的到来,Web应用程序越来越...
Prototype与jQuery的对比 虽然Prototype和jQuery都致力于简化JavaScript开发,但两者有其独特之处。Prototype更注重于语言层面的扩展,提供了许多核心的JavaScript增强;而jQuery则以选择器和链式操作闻名,对DOM...
在JavaScript的世界里,jQuery和Prototype都是非常流行的库,它们各自提供了丰富的功能来简化DOM操作和事件处理。然而,当这两种库在同一页面中同时使用时,会出现一个问题:它们都使用了"$"符号作为主要的选择器...
- jQuery与 Prototype、MooTools等其他JavaScript库的共存策略。 - jQuery与AngularJS、React等现代前端框架的配合使用。 4. **性能优化** - 减少DOM操作次数以提升性能。 - 使用事件代理提高事件处理效率。 -...
### 浅谈JavaScript库——jQuery与ExtJs的对比研究 #### 一、引言 随着Web 2.0和RIA(Rich Internet Applications)技术的普及,JavaScript作为一种前端开发的重要工具,逐渐占据了重要的地位。它不再仅仅是用于...
3. jQuery与其他JavaScript库的对比:作者提到自己曾用过多种JavaScript库,包括Moo.fx、Scriptaculous、TW-SACK和Prototype,但最终对jQuery产生了浓厚的兴趣。通过对比,我们可以发现jQuery在编写简洁代码、快速...
**jQuery与其他JavaScript库的对比** 除了jQuery,还有YUI、Prototype、Mootools、Dojo 和 ExtJS等流行的JavaScript库。这些库各有特点,如: - **YUI**:由雅虎开发,提供丰富的交互组件和强大的功能。 - **...
- **与其他JavaScript库的对比**:与Prototype、YUI、Dojo和mooTools等库相比,jQuery不冲突于全局命名空间,学习曲线较平缓。 2. **jQuery开始前的准备** - **jQuery下载**:最新版本为1.4.2,可在官方网站下载...
在2008年,jQuery由John Resig发布,成为继Prototype之后的另一个杰出的JavaScript框架。它以Ruby的简洁风格与Java的复杂性形成了鲜明对比,使得JavaScript编程变得更加直观和高效。 **jQuery的核心特点** 1. **轻...
文档中给出的两个示例对比了使用传统 JavaScript 和 jQuery 来创建并设置 div 元素的不同之处: 1. **传统 JavaScript 方法**:通过 `document.createElement` 创建元素,并使用 `.style` 属性设置样式。这种方式...
除了jQuery之外,还有其他一些知名的JavaScript库,如Prototype.js、MooTools等,但jQuery因其易用性和强大的功能,在前端开发领域占据了主导地位。 #### 1.4 jQuery应用示例 下面是一个简单的jQuery应用示例,...