天天看點

使用jQuery Mobile和JSON建立移動應用程式

壓縮後的jQuery也大概有40-50K,可能還會稍微多一些,此外,如果你想要jQuery UI和一些動畫功能,那麼就還需要100K。對于移動裝置來說,可能沒有那麼多空間。

  JQM Alpha 3現在已經精簡到17K,其中還有相關的CSS檔案。

總體上的簡單性: 你可以主要使用标簽驅動的方式開發頁面,那樣,你隻需要使用很少或者不使用JavaScript。 進一步改善和得體的降格: jQuery Mobile哲學是要同時支援高端和性能較差的裝置,包括那些不支援JavaScript的裝置,并且還要盡可能提供最佳體驗。 可通路性: jQuery已經支援可通路的富Internet應用程式(WAI-ARIA),以有助于使用輔助技術讓有殘疾的通路者也能夠通路網頁。 小檔案 主題

  安裝JQM很簡單,隻需要添加一個樣式表檔案和三個JavaScript檔案:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1 /jquery.mobile-1.0a1.min.css" />  <script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>  <script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"> </script>  <script src="http://jquery.ibm.navitend.com/utils.js"></script> 

  此外,Frank還提到,在移動領域JQM的關鍵優勢就在于,它能夠使用AJAX讓使用者界面更平滑:

JQM把Ajax提升了一個層次,這是通過攔截頁面請求,并在大多數情況下把這些請求轉化為指定的Ajax調用達到的。最基本的結果是,當使用者通路使用JQM建構的web應用程式時,隻會修改頁面的DOM結構,而不是每次都替換所有頁面。

  這種效果是通過使用HTML5的data-*屬性達到的。在HTML5中,任何帶有data-字首的屬性本質上都會被驗證解析器忽略,而應用程式可以任意地攔截那些屬性。JQM依賴于data-role屬性把它的核心功能組合成字元串。

當JQM應用程式從一個頁面切換到下一個頁面時,發生的主要動作就是内容div中的内容會換成新頁面的内容。

  我們可以使用data-rel屬性請求視窗如何顯示,當它顯示出來的時候,data-transition屬性會告訴JQM做出相應的轉換。我們可以使用data-filter屬性來指定data-role清單的行為,而該清單可以基于輸入的關鍵字來過濾清單的值。Frank還說明了如何建立自定義的data-*屬性,進而實作應用程式的特殊屬性。

  JQM會在今年上半年釋出。Frank最後做出結論:

随着時間的推移,我們期望它能夠整合到像PhoneGap之類的架構中,并且可能會整合到像Appcelerator的Titanium等開發環境中。

  你認為基于Web的移動應用程式有前途嗎? 這隻是架構和開發是否簡單的問題,還是移動應用程式非常特殊(因為使用者會使用自己的用戶端,并期望獲得最好的使用者體驗和安全性)以緻于基于Web的應用程式隻會成為新平台上的邊緣程式。

繼續閱讀