Jumony第一個公開預覽版,在.NET里玩轉jQuery選擇器!
在用ASP.NET做網站頁面的時候,最常見和最麻煩的需求便是頁面的數據綁定。對于大多數內容網站而言,動態頁面和靜態頁面的的區別僅在于是否有動態數據綁定在上面。然而隨著Web前端技術的發展,我們所面對的頁面也越來越復雜,譬如說這種頁面或是這種頁面,在ASP.NET傳統的技術下,就很麻煩。
最近幾年一直在做ASP.NET,其實我一直很討厭WebForm的模型,這種將WinForm的套路直接照搬到Web上的做法只是把問題變得更復雜。我在探求一種與HTML完美契合,真正適應HTML的游戲規則的頁面處理引擎。我想,這個引擎至少要有這樣一些特點:
1、完全的控制HTML,能夠自由的決定HTML元素的類型、個數、結構。
2、不會劫持HTML,例如修改元素的id或是name。
3、不要諸多限制,例如只能有一個form或是只能本頁提交。
OK,上面這幾條完全是針對WebForm模型來說的,沒錯,這些是WebForm讓我覺得最惡心的問題。HTML其實是一個很好的行之有效的游戲規則,在其上另外構建一套秩序,而又不能適應豐富的網站表現形式,WebForm也就注定只能在網站管理后臺施展拳腳。
那么除此之外,我還希望:
4、能夠像在客戶端一樣操作每一個HTML元素,每一個HTML元素都有友好的訪問接口。
5、可以自動適應不規范的HTML文檔并規范化輸出。
6、可以理解HTML文檔并進行適當的優化(例如簡寫樣式,更極端一點,刪除font標簽或是合并連續的span)。
7、能夠方便的進行數據綁定。
8、能夠分離數據綁定和處理邏輯與頁面,避免對模板頁面進行破壞性修改,代碼可以適應頁面的調整,修改頁面不會廣播到代碼。
…………
雖然有這樣一個理想,但在很長一段時間內,我并沒有找出一個合適的切入點。直到我接觸了jQuery,并嘗試用jQuery進行了一些復雜頁面的數據綁定。結果正如你所見,只需要簡單的腳本,就完成了看起來很復雜的事情。
于是,我便開始著手在C#上建立一個類jQuery框架,這就是Jumony的由來。
Jumony真正的開發工作比我想象的順利很多,思路對了開發起來其實是很快的。我選用了HtmlAgilityPack作為我的HTML Parser,這個東西的好處除了開源之外,更重要的是為C#提供了友好的DOM訪問接口,老實說mshtml的COM接口用起來真讓人抓狂。然后是CSS選擇器,原本以為會是一件很麻煩的事情,但事實上我只用了一個周末就實現了核心的選擇器。正好手頭上有一個項目。
便直接拿來實驗,效果完全超出了我的期望。像這個頁面下面的列表,每隔三個便有一個樣式的切換,直接用Repeater來做數據綁定是一件很煩人的事情,而用選擇器,則完全可以忽略不同item之間的區別,只要主要結構不變,那么每一個item的綁定邏輯就可以一樣。而且代碼寫起來幾乎是一種享受,就像jQuery那樣,只需要描述自己的意圖便可。。。。
這里所舉的這個例子,使用的是Jumony非常原始的一個版本,你可以看到頁面的擴展名還是ashx,然后代碼也不夠簡潔,但已經可以極大地提高開發效率。Jumony仍然在開發和完善中,在8月2日,我得到了一個相對穩定一些的版本,并為其作了一個tag分支,這也就是這一次與大家分享的版本。大多數的選擇器均已被實現,提供了大量的數據綁定的輔助方法,可以用很少的代碼完成一些看起來很復雜的數據綁定。我在部門例會上演示了一下利用Jumony把網易的首頁扒下來,再把其中一個部分用新浪的新聞數據綁定。當然更多更好玩的應用有待大家去發掘。
我并不希望在這里列出一份功能列表,或是使用手冊。一則是我沒有時間也不擅長做這些工作。其次是Jumony每天都有新的特性被加入,我也不記得到底哪些特性是包含在這個CTP里面的了。
還是不多說廢話了,對于Jumony,我覺得,玩它,用來做一些有趣的事情,就是最好的了解方式,就像你不會看完了jQuery的文檔后才開始用jQuery寫頁面。
下載地址:http://files.cnblogs.com/Ivony/Jumony_CTP(20100802).rar
解包后是一個網站(是WebSite不是WebProject),用VS的添加現有網站功能打開,然后用VS自帶的ASP.NET Development Server(IIS需要映射擴展名,麻煩)瀏覽Beginning.htm頁面即可。
源代碼隨下一篇文章(預計下周)發布,請不要在下面留個郵箱什么的(你不會收到代碼而只會收到代開發票或是福建鐵觀音之類的郵件),先玩吧,源代碼整理好后即隨下篇文章發布。
留言列表