快捷導(dǎo)航

Jquery之美中不足小結(jié)

更新時(shí)間：2011年02月16日 16:18:15 作者：

在QWrap群里討論時(shí)，有同學(xué)問jquery/yui等已做到極致，我們有沒必要再重復(fù)造一個(gè)叫QWrap的輪子？

是的，jquery成功挖掘selector、鏈?zhǔn)接梅āsetter用法、很多精簡命名，等等，讓前端變得輕松簡單，為Web開發(fā)作出巨大貢獻(xiàn)。
不過，它也有一些不盡人意的地方。

1。關(guān)于代碼坨之一。

一直覺得jquery是個(gè)個(gè)人英雄主義的產(chǎn)物，有耐心看完他代碼的，絕對少于百分之一。
sizzle獨(dú)立出來后，ms有些改觀。
可一坨一坨并且相互牽連的風(fēng)格，還是在sizzle與jquery到處都是。
有時(shí)想：John如果不寫代碼了，誰會(huì)愿意來接手這些坨坨。

2。關(guān)于代碼坨之二。

不知有沒有組件開發(fā)者想過“依賴jquery開發(fā)出一個(gè)能不依賴jquery而獨(dú)立運(yùn)行的組件”？
這是奇怪的需求嗎？----好像不是。
有這樣的需求嗎？----很多同學(xué)會(huì)說：“jquery已經(jīng)樹大根深好乘涼可依賴，為什么還要獨(dú)立運(yùn)行?！?
也是，組件開發(fā)者的水平一般都還不錯(cuò)，他們會(huì)想辦法解決這些問題的。如果有這樣的需要，他們會(huì)去找到對應(yīng)的方法庫的。
不過，這也說明了，jquery不能滿足這些人的需求。
因?yàn)閖query就是個(gè)代碼坨。想拆成靜態(tài)方法庫，那幾乎是不可能的。

3。關(guān)于“專注于dom”之一。

不知道該說好，還是該說不好。
覺得jquery的團(tuán)隊(duì)，絕對有能力做一個(gè)全面的框架，而不只是停在“專注于dom”這一點(diǎn)上。
使用jquery與jquery組件，我們可能還得自己去找個(gè)種子文件，來作異步加載等。
因?yàn)檫@些的種子需求，其實(shí)是跟dom沒啥緊密關(guān)系的，所以jquery可以完全不顧-----倒是很會(huì)偷懶啊。
另，關(guān)于種子文件，YUI3把use當(dāng)核心點(diǎn)是個(gè)不錯(cuò)的創(chuàng)意，可惜發(fā)揮得有點(diǎn)太過。到Y(jié)UI3后，我想只用他的selector來作個(gè)性能比對，竟然要加載一推文件才能做到。

4。關(guān)于“專注于dom”之二。
“jquery專注于dom”，
那字符串的trim，需要在jquery里嗎？----貌似沒必要吧。不過jquery順手提供了。類似的還有parseJSON、globalEval等。
那字符串模板功能(tmpl)呢？----模板明顯是應(yīng)該基于字符串的，因?yàn)樽址０宄Ｓ脕斫M織html字符，所以，jquery會(huì)把它牽強(qiáng)的放進(jìn)來。并且是基于dom的。----我實(shí)在想說：真的很牽強(qiáng)。
我們在項(xiàng)目中，可能還會(huì)用到很多跟字符串有關(guān)的功能(trim|subByte|encode4Hhtml等)、跟object有關(guān)的功能(get|dump|mix等)、跟數(shù)組有關(guān)的功能(forEach|map)，等等。
這些問題，jquery都沒有幫我們解決的意思，那我們是不是都得再另請高明或自已解決？

5。關(guān)于sizzle。
A：有時(shí)候覺得sizzle是個(gè)半成品，一些本來可以順手提供的功能，卻沒提供出來。
例如:
selector2filter(selector) //把一個(gè)selector轉(zhuǎn)化成一個(gè)過濾函數(shù)。
filter(els,selector,refEl) //以ref為參考元素，按selector條件過濾els。例如，在delegate時(shí)會(huì)用到。由于sizzle沒提供，導(dǎo)致$('#id').delegate('>li','click',handle)中的'>li'的參考元素不是#id對應(yīng)的對象
B：sizzle如果想解決以下這兩個(gè)問題，可能得傷筋動(dòng)骨了。

復(fù)制代碼代碼如下:

 
<h1 id="head1">主題</h1> 
<ul><li>明細(xì)1.1</li><li>明細(xì)1.2</li></ul> 
<ul><li>明細(xì)2.1</li><li>明細(xì)2.2</li></ul> 
<script> 
alert($('#head1~ul>li').length);//應(yīng)該是4而不是0。因?yàn)閟izzle在取候選集時(shí)偷懶了，沒有認(rèn)真的處理候選集問題 
</script> 

復(fù)制代碼代碼如下:

 
<ul> 
<li> 
<div> 
<div> 
<span>需要的</span> 
</div> 
</div> 
</li> 
<li> 
<h1> 
<div> 
<span>不需要的</span> 
</div> 
</h1> 
</li> 
</ul> 
<script> 
alert($('li>div span').length); //應(yīng)該是1，而不是0。因?yàn)閟izzle在過濾時(shí)偷了懶，把回溯的情況給忽略了。 
</script> 