TGideas實例：加載，不只是少一點點(3)

2013/1/13 20:30:10來源：TGideas

為XXX的XML文件中；使用load(“XXX”)方法加載本地的XXX.xml文件，并用getAttribute獲取已經(jīng)存儲的內(nèi)容。

圖2-8 IE的本地存儲數(shù)據(jù)

關(guān)于HTML5本地存儲localStorage的詳細方法，請參見我的翻譯文章《網(wǎng)絡應用程序本地存儲的前世今生》。

圖2-9 Chrome的本地存儲數(shù)據(jù)

對于IE瀏覽器，使用IE提供的userData方法；對于支持HTML5的瀏覽器(Firefox、Chrome、Safari、Opera等)，使用localStorage提供的方法；對于其他瀏覽器使用常規(guī)方法加載內(nèi)容。

圖2-10 判斷流程

1.2.2 資源處理

對于本地存儲，我們可以使用來存儲數(shù)據(jù)，或者能轉(zhuǎn)為數(shù)據(jù)形式的文件。例如一些SEO要求不高的文字，鏈接等等。

圖2-11 數(shù)據(jù)存儲

對于圖片、CSS、JS等文件，我們也可以轉(zhuǎn)為文本來存儲在本地。這種方式大量應用于移動端。例如《掌上英雄聯(lián)盟》APP的圖片大部分都轉(zhuǎn)化為base64編碼存儲在本地（不用離線存儲的原因前面提及了）。Google和Bing的移動版，也將CSS和JS拆分后本地存儲了。

圖2-12 腳本的本地存儲

圖2-13 圖片轉(zhuǎn)base64編碼后的本地存儲

另外，對于本地存儲更新，我的做法是：先判斷本地是否存在已存儲的內(nèi)容，如果沒有數(shù)據(jù)或者版本已過期（所謂版本是我設置的一個變量，當修改這個變量時即為版本過期），加載相應的JS數(shù)據(jù)，通過一個函數(shù)將數(shù)據(jù)處理為需要的格式，然后存儲在本地；如果有且版本沒過期，直接從本地獲取數(shù)據(jù)。接著將數(shù)據(jù)通過函數(shù)進行進一步的處理，插入相對應的結(jié)構(gòu)中。