怎么用？
<html manifest="cache.manifest">
</html>
然后cache.manifest文件的書寫方式，就像下面這樣：
CACHE MANIFEST
#v0.11
CACHE:
js/app.js
css/style.css
NETWORK:
resourse/logo.png
FALLBACK:
/ /offline.html
cache 表示在離線時存儲的資源
network 表示在在線的情況下才能訪問 ，不會離線存儲 但如果它與cache中有一個相同的資源，那么cache還是會離線存儲這個資源
fallback 表示如果訪問第一個資源失敗 那么會使用第二個資源來替換他，/ /offline.html 就表示在根目錄下任何一個資源失敗了，那么就會訪問offline.html
瀏覽器怎么解析manifest
1.在線的情況下，瀏覽器發(fā)現(xiàn)頭部有manifest屬性，會請求manifest文件，如果是第一次訪問，則進行離線存儲，如果已經(jīng)進行了離線存儲，會使用離線文件加載頁面，瀏覽器會對比新的manifest文件和舊的manifest文件，如果沒有發(fā)生改變則不做變化，如果文件改變了，就會重新下載資源離線存儲
2.離線情況下，瀏覽器直接使用離線存儲的資源
在這個過程中需要注意幾個問題：
a.如果服務器對離線的資源進行了更新，那么必須更新manifest文件之后這些資源才能被瀏覽器重新下載，如果只是更新了資源而沒有更新manifest文件的話，瀏覽器并不會重新下載資源，也就是說還是使用原來離線存儲的資源。
b.對于manifest文件進行緩存的時候需要十分小心，因為可能出現(xiàn)一種情況就是你對manifest文件進行了更新，但是http的緩存規(guī)則告訴瀏覽器本地緩存的manifest文件還沒過期，這個情況下瀏覽器還是使用原來的manifest文件，所以對于manifest文件最好不要設置緩存。
c.瀏覽器在下載manifest文件中的資源的時候，它會一次性下載所有資源，如果某個資源由于某種原因下載失敗，那么這次的所有更新就算是失敗的，瀏覽器還是會使用原來的資源。
d.在更新了資源之后，新的資源需要到下次再打開app才會生效，如果需要資源馬上就能生效，那么可以使用window.applicationCache.swapCache()方法來使之生效，出現(xiàn)這種現(xiàn)象的原因是瀏覽器會先使用離線資源加載頁面，然后再去檢查manifest是否有更新，所以需要到下次打開頁面才能生效。
試一試：
CACHE MANIFEST
#v0.11
CACHE:
lib/ionic/js/ionic.bundle.js
lib/angular-ui-router.js
js/app.js
lib/ionic/css/ionic.css
css/style.css
views/login_header.html
views/login.html
lib/ionic/fonts/ionicons.ttf?v=1.5.2
lib/ionic/fonts/ionicons.woff?v=1.5.2
NETWORK:
lib/ionic/fonts/ionicons.ttf?v=1.5.2
lib/ionic/fonts/ionicons.woff?v=1.5.2
css/style.css
然后我們訪問網(wǎng)頁看看效果。
可以看出瀏覽器根據(jù)manifest文件下載相應資源并且緩存在本地，現(xiàn)在我們來試試再次訪問網(wǎng)頁
資源已經(jīng)離線存儲在本地，所以瀏覽器不需要再次下載資源，可以直接使用本地緩存的資源。接著，我們更新下服務器上的資源，比如我修改下app.js，結(jié)果我這里就不顯示了，跟上面那張圖是一樣的，更新的資源并沒有生效，現(xiàn)在我們更新下manifest文件，比如把版本改為0.12
很顯然，只有更新了manifest文件，對離線資源的更新才能在瀏覽器上生效。
最后，我們來試試離線狀態(tài)下是什么情況，這才是離線存儲的重頭戲。通過Chrome設置離線狀態(tài)，刷新頁面
由于在離線狀態(tài)，所以瀏覽器無法訪問到manifest文件，但是網(wǎng)頁還是可以正常訪問，這就是離線存儲的威力。
對于HTML5中離線存儲對象window.applicationCache有幾個事件需要我們關注下：
1.oncached:當離線資源存儲完成之后觸發(fā)這個事件，這個是文檔的說法，我在Chrome上面測試的時候并沒有觸發(fā)這個事件。
2.onchecking:當瀏覽器對離線存儲資源進行更新檢查的時候會觸發(fā)這個事件
3.ondownloading:當瀏覽器開始下載離線資源的時候會觸發(fā)這個事件
4.onprogress:當瀏覽器在下載每一個資源的時候會觸發(fā)這個事件，每下載一個資源就會觸發(fā)一次。
5.onupdateready:當瀏覽器對離線資源更新完成之后會觸發(fā)這個事件
6.onnoupdate:當瀏覽器檢查更新之后發(fā)現(xiàn)沒有資源更新的時候觸發(fā)這個事件
----閱讀筆記-摘自：
https://segmentfault.com/a/1190000000732617
