快捷導(dǎo)航

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

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

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

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

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

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

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

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

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

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

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

5。關(guān)于sizzle。
A：有時(shí)候覺(jué)得sizzle是個(gè)半成品，一些本來(lái)可以順手提供的功能，卻沒(méi)提供出來(lái)。
例如:
selector2filter(selector) //把一個(gè)selector轉(zhuǎn)化成一個(gè)過(guò)濾函數(shù)。
filter(els,selector,refEl) //以ref為參考元素，按selector條件過(guò)濾els。例如，在delegate時(shí)會(huì)用到。由于sizzle沒(méi)提供，導(dǎo)致$('#id').delegate('>li','click',handle)中的'>li'的參考元素不是#id對(duì)應(yīng)的對(duì)象
B：sizzle如果想解決以下這兩個(gè)問(wèn)題，可能得傷筋動(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í)偷懶了，沒(méi)有認(rèn)真的處理候選集問(wè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在過(guò)濾時(shí)偷了懶，把回溯的情況給忽略了。 
</script> 