jQuery与prototype的比较

jQuery与Prototype对比

最新推荐文章于 2023-10-31 17:49:28 发布

最新推荐文章于 2023-10-31 17:49:28 发布 · 203 阅读

文章标签：

18 篇文章

订阅专栏

本文对比了jQuery与Prototype这两个流行的JavaScript库。从语法、选择器、DOM操作等方面进行了详细比较，并探讨了两者在类创建、冲突解决、效果处理及位置范围等功能上的差异。

jQuery与prototype的比较

主要区别

Prototype

jQuery

Extends the DOM and core javascript objects.是在javascript核心上做文章，模拟传统的OO编程，选择器返回的对象是DOM对象。

全新的封装；

选择器选取的对象是jQuery对象。

提供一系列的实用函数

Differences in Native Support

Syntax Comparison

Prototype	jQuery
Dollar变量
prototype uses $ for id based selection	jQuery $= CSS based selector(=$$ in Prototype).
$(‘speech1’).show();	$(‘#speech1’).show();
CSS based Selectors
$$ or Element.getElementsBySelector(selector)	$
$$(‘.dialog’).invoke(‘show’);	$(‘.dialog’).show();
DOM Ready Event
Event.observe(window,’load’,function(){});	$(document).ready(function{});
$$(‘.dialog’).invoke(‘show’);	$(‘.dialog’).show();
DOM Manipulation
Insertion class: After,Before,Bottom,Top,update	after,before,append,prepend,html.
Element Classes
addClassName,removeClassName, toggleClassName,hasClassName	addClass,removeClass,toggleClass,is
Elements
Event class:observe,stopObserving	Bind,unbind,同时支持.click,.dbclick,等等
Ajax
New Ajax.Request(url,[,option])	$.ajax(options) //url inclued in options
Method Comparison
oncreate(), onSuccess(), onException(), onComplete()	beforeSend(), success(), error(), complete()
Plugins/Extensions
Element.addMethods({myPlugin:function (element,args){return element;}});	jQuery.fn.myPlugin = function(args) {return this;};
Brower Detection
Prototype.Browser.IE,	jQuery.browser.msie
其他资源
API: prototypejs.org/api Tutorials: prototypejs.org/learn	API: docs.jquery.com/core Tutorials: docs.jquery.com/Tutorials