這篇“HTML5之離線的應用以及存儲的應用”文章，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們一定要參考一下，對于“HTML5之離線的應用以及存儲的應用”，小編整理了以下知識點，請大家跟著小編的步伐一步一步的慢慢理解，接下來就讓我們進入主題吧。

成都創新互聯專業為企業提供玉山網站建設、玉山做網站、玉山網站設計、玉山網站制作等企業網站建設、網頁設計與制作、玉山企業網站模板建站服務，10余年玉山做網站經驗，不只是建網站，更提供有價值的思路和整體網絡服務。

html是什么

html的全稱為超文本標記語言，它是一種標記語言，包含了一系列標簽．通過這些標簽可以將網絡上的文檔格式統一，使分散的Internet資源連接為一個邏輯整體，html文本是由html命令組成的描述性文本，html命令可以說明文字，圖形、動畫、聲音、表格、鏈接等，主要和css+js配合使用并構建優雅的前端網頁。

1.離線應用

離線應用是 HTML 5 新增的以想功能，旨在幫助用戶在沒有網絡的情況下，也可以使用 web 應用程序。
HTML 5 離線功能，包含【離線資源緩存】、【在線狀態監測】、【本地數據存儲】。

• 離線資源緩存 - 通過瀏覽器機制，將在線資源緩存到本地，當用戶離線訪問應用程序時，這些資源文件自動從本地加載，從而讓用戶可以正常的使用應用程序。

• 在線狀態監測 - 有些應用需要跟服務器做一些數據的交互，應用開發者需要知道瀏覽器是否處于在線狀態，HTML 5 提供了在線狀態監測。（window.online = function(){}）

• 本地數據存儲 - 當應用程序處于離線狀態時，程序需要把用戶產生的數據存儲到本地，以便于在線時同步到服務器上。為此，HTML 5 提供了多種本地存儲機制。

離線 web 應用對比普通的 web 應用，多了一個描述文件，用于列出【需要緩存】和【永不緩存】的資源。該文件擴展名為【.appcache】，描述文件的 mime-type 類型為 “text/cache-manifest”。

offline.appcache 文件的代碼如下

CACHE MANIFEST
#cache 之后的資源都會被緩存
CACHE:
main.html
style.css
main.js
#network 之后的資源不會被緩存，總是從線上獲取
NETWORK:
account/

如果離線化應用程序，只需將 .html 文件 和 manifest 描述文件關聯起來即可

2.LocalStorage（本地存儲） 和 SessionStorage（會話存儲）

cookie 的弊端

• 大小受限 - 標準瀏覽器下，單個Cookie 的大小為 4kb。

• 消耗性能 - 當前域下的所有 http 請求都會攜帶這些 Cookie 數據。

HTML5 的本地存儲為每個網站分配的空間時 【5MB】

LocalStorage 和 SessionStorage 的區別
前者會一直存儲在本地，直到手動清除；
后者則存活在當前頁面的生命周期中，一旦頁面關閉，存儲的數據也會消失。

以上是“HTML5之離線的應用以及存儲的應用”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創新互聯行業資訊頻道！