HTML5的應用快取

2022-02-01 03:22:00 字數 877 閱讀 5074

使用應用快取可以得到以下益處:

用法:只需要在你的頁面頭部加上乙個 manifest 的屬性就可以了。

...

cache.manifest檔案的書寫方式:

cache manifest

# v1 2011-08-14# 這是乙個完整的頁面

index.html

cache.html

style.css

image1.png

network:

network.html

fallback:

/ fallback.html

1.cache:表示需要離線儲存的資源列表,由於包含manifest檔案的頁面將被自動離線儲存,所以不需要把頁面自身也列出來。

3.fallback:表示如果訪問第乙個資源失敗,那麼就使用第二個資源來替換他,比如上面這個檔案表示的就是如果訪問根目錄下任何乙個資源失敗了,那麼就去訪問fallback.html。

1.oncached:當離線資源儲存完成之後觸發這個事件,這個是文件的說法,我在chrome上面測試的時候並沒有觸發這個事件。

2.onchecking:當瀏覽器對離線儲存資源進行更新檢查的時候會觸發這個事件

3.ondownloading

4.onprogress

5.onupdateready:當瀏覽器對離線資源更新完成之後會觸發這個事件

6.onnoupdate:當瀏覽器檢查更新之後發現沒有資源更新的時候觸發這個事件

HTML5 應用快取

html5 引入了應用程式快取,這意味著 web 應用可進行快取,並可在沒有網際網路連線時進行訪問。應用程式快取為應用帶來三個優勢 新增快取 manifest 檔案可分為三個部分 network 在此標題下列出的檔案需要與伺服器的連線,且不會被快取 fallback 在此標題下列出的檔案規定當頁面無...

HTML5之應用快取

html書寫 html manifest檔案的書寫方式 cache manifest cache theme.css logo.gif main.js network xx fallback x.css tesr.css 原檔案 替代檔案 當原檔案不能用時使用替代檔案 客戶端快取的更新 只有修改ma...

HTML5應用快取機制

用360瀏覽器的使用者對這張圖應該都是耳熟能詳了吧,沒錯,當網路不通暢時使用360瀏覽器,便會有這張圖彈出來。為什麼沒有網路還能彈出這一副畫面呢?這就關乎html5的應用快取機制了。那什麼是應用快取機制呢?怎麼使用應用快取?首先,我們需要新建乙個自定義的清單檔案 manifest file 在這裡我...