首頁  >  文章  >  web前端  >  jquery與prototype框架的詳細對比_jquery

jquery與prototype框架的詳細對比_jquery

WBOY
WBOY原創
2016-05-16 17:13:25827瀏覽

以前做介面是用jquery的,現在因為要用許多ajax效果,改用了rails自帶的prototype

因為jquery用多了,換個框架也大同小異,不過細節上有很多不同。 。 。

1.dom載入方面:

jquery有dom ready方法,推遲js函數的綁定知道dom樹完成(如果沒有這個功能,一些element的事件函數之類的綁定可能會出錯):

$(document).ready(function(){});

但是prototype是沒有的。 。 。得自己找非官方的擴展,不方便,這個基本的功能,這麼重要的功能,不知道為啥遲遲不加到核心庫

2.path查找,dom定位方面

jquery的dom查找和css定位一致,用過就感覺非常方便,這是他的一大亮點和優點

$('.func #select_all').click(function()
$(this).parent('div').parent('div').find('li .checkbox input:checkbox' )

prototype只有找單一dom物件方便--$(id)

比較麻煩的是把單一和陣列分開了,如果找一個路徑下的許多物件

得$$('div .right_contact'),這種風格仍然是定位某一類型的物件

而不是用路徑查找,這方面不如jquery方便和概念一致

3.函數,事件綁定
舉例,把class為right_contact的div綁定click高亮事件,prototype寫法是:

複製程式碼 程式碼如下:

$$('div .right_contact').each(function(item) {
item.observe('click', function(event){
new Effect.Highlight(item,{ duration: 2.0,startcolor: '#ffff99',endcolor: '#fffffffff',restorecolor: '# fffffff' });
});
});

如果是jquery,簡潔很多:

$('.right_contact').click(function(){   
$(this).toggleClass('hilight');
})

我用過很多框架,印象最深刻的是一個叫hge game engine的框架,封裝了大量的底層細節和實現方法,然後他說:you could create everything from a simple puzzle to advanced multilayered platformer or strategygy without even thinking of any non game logic code

優秀的框架應該是讓人集中註意到業務邏輯上而不是技術特性,設計模式上這方面,jquery比prototype優秀,最典型的例子就是如果要滑鼠點擊觸發函數,prototype搞個大而全的observe方法,然後去註冊click事件
而jquery就有item.click函式。 。 。 observe是能包容萬象,不過jquery這種為最常用的事件特地創建專有函數的做法,更能讓人集中註意力到業務邏輯上。 。 。

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn