H5の前に、ストレージは主にCookieで使用されていました。 Cookieの欠点は、リクエストヘッドのデータがあり、サイズは4K以内です。ロードドメイン汚染。
主なアプリケーション：ショッピングカート、顧客ログイン
IEブラウザの場合、userDataがあり、サイズは64kで、IEブラウザーによってのみサポートされています。
ターゲットキー価値のある方法でのストレージ、永続的なストレージは、手動で削除されない限り、決して失敗しません。
サイズ：各ドメイン名5m
サポート状況：注：IE9 LocalStorageは、ローカルファイルをサポートする必要があります。
検出方法： if（if（window.localStorage）{alert（ 'このブラウザーはlocalStorage'）一般的なAPI：getItem //レコードを取得します
Setititen //設定レコード
removeItem //レコードを削除します
キー//キーに対応する値を取ります
クリア//クリアレコード
ストレージコンテンツ：配列、写真、json、スタイル、スクリプト。エッセンスエッセンス（文字列コンテンツにシリアル化できる限り、保存できます）
2。ローカルストレージSessionStorageHTML5のローカルストレージAPIのLocalStorageは、sessionStorageと同じです。
3。オフラインキャッシュ（アプリケーションキャッシュ）ローカルキャッシュアプリケーションに必要なファイル
使い方：manifestファイルを構成します
ページ：
<！マニフェストファイル：
マニフェストファイルは、ブラウザにキャッシュコンテンツ（およびキャッシュされないコンテンツ）を通知する単純なテキストファイルです。
マニフェストファイルは3つの部分に分割できます。
①キャッシュマニフェスト - このタイトルにリストされているファイルは、最初のダウンロード後にキャッシュされます
②network-このタイトルの下にリストされているファイルは、キャッシュされずにサーバーに接続する必要があります
③フォールバック - このタイトルにリストされているファイルは、ページにアクセスできないときのリトリートのページ（404ページなど）を規定しています
完全なデモ：キャッシュマニフェスト＃2016-07-24 V1.0.0/thema.css/main.jsnetwork：login.jsp Fallback：/html//offline.htmlサーバー上：マニフェストファイルは、正しいMIMEタイプ、つまりText/Cache-Manifestを構成する必要があります。
Tomcatなど：
<mime-mapping> <extension> manifest </extension> <mime-type> text/cache-manifest </mime-type> </mime-mapping >>一般的なAPI：
コアは、アプリケーションキャッシュの現在の状態を示すステータス属性があります。
0（不要）：キャッシュなし、つまり、ページに関連するアプリケーションキャッシュはありません
1（アイドル）：アイドル、つまり、アプリケーションキャッシュが更新されていません
2（チェック）：チェック中、説明ファイルをダウンロードし、更新をチェックしています
3（ダウンロード）：ダウンロードでは、アプリケーションキャッシュが説明ファイルで指定されたリソースをダウンロードしています
4（updateready）：更新された、すべてのリソースがダウンロードされました
5（アイドル）：放棄された、つまり、アプリケーションキャッシュの説明ファイルは存在しなくなるため、ページはアプリケーションキャッシュにアクセスできません
関連イベント：キャッシュ状態の適用の適用の変更を示します。
チェック：ブラウザがアプリケーションキャッシュを検索するとトリガーされます
エラー：リソースのチェックまたはダウンロード中にエラーを送信するときのトリガー
NOUPDATE：説明ファイルをチェックするときにトリガーされ、ファイルが変更されていないことがわかりました
ダウンロード：キャッシュリソースのアプリケーションをダウンロードするときにトリガーされます
進行状況：ファイルダウンロードアプリケーションキャッシュのプロセスで継続的にトリガー
updateready：ページトリガーの新しいアプリケーションキャッシュのダウンロード
キャッシュ：アプリケーションキャッシュが完全に利用可能になったときにトリガー
アプリケーションキャッシュの3つの利点：①オフラインの閲覧
pageページの顔の収入速度を上げます
serverサーバーの圧力を下げます
注記：
1.キャッシュデータのブラウザの容量制限は同じではない場合があります（一部のブラウザによって設定された制限は、サイトごとに5MBです）
2.マニフェストファイル、または内部にリストされているファイルを正常にダウンロードできない場合、更新プロセス全体が障害と見なされ、ブラウザは古いキャッシュを引き続き使用します
3.マニフェストのHTMLは、同じドメインの下でマニフェストファイルと同じでなければなりません
4.ブラウザは、ManifestファイルのHTMLファイルを自動的にキャッシュします。これにより、HTMLコンテンツが変更された場合、更新バージョンが更新されます。
5.マニフェストファイルのキャッシュは、ネットワークとフォールバックとは関係ありません
6.フォールバックのリソースは、マニフェストファイルと同じでなければなりません
7.バージョンを更新した後、新しいバージョンを起動するために一度更新する必要があります（ページの状況は一度ブラシをかけます）。イベントの監視バージョンを追加する必要があります。
8.サイト内の他のページがセットアップされていない場合でも、リクエストリソースにキャッシュのキャッシュからアクセスできます
9.マニフェストファイルが変更されると、リソースリクエスト自体も更新をトリガーします
オフラインキャッシュと従来のブラウザキャッシュの違い：1.オフラインキャッシュはアプリケーション全体用です。ブラウザキャッシュは単一のファイルです
2。オフラインのキャッシュ切断がある場合は、ページを開くことができます。
3.オフラインキャッシュは、ブラウザにリソースを更新するために積極的に通知することができます
4.WEB SQLリレーショナルデータベース、SQLステートメントを介したアクセス
Web SQLデータベースAPIはHTML5仕様の一部ではありませんが、SQLを使用してクライアントデータベースを操作するAPIのセットを導入する独立した仕様です。
サポート状況：Web SQLデータベースは、Safari、Chrome、Operaブラウザーの最新バージョンで動作できます。
コア方法： pendatabase：このメソッドは、既存のデータベースまたは新しいデータベースを使用して、データベースオブジェクトを作成します。トランザクション：この方法により、この状況に基づいてトランザクションを制御し、提出またはロールバックを実行できます。 cutesQL：このメソッドは、実際のSQLクエリを実行するために使用されます。データベースを開きます：var db = opendatabase（ 'mydb'、 '1.0'、 'test db'、2 * 1024 * 1024、fn）; // opendatabase（）データベースサイズ、作成コールバッククエリ操作を実行します：
var db = opendatabase（ 'mydb'、 '1.0'、 'test db'、2 * 1024 * 1024）;データを挿入します：
var db = opendatabase（ 'mydb'、 '1.0'、2 * 1024 * 1024）; 1、winty） '）データを読む：
db.transaction（function（tx）{tx.executesql（ 'select * from win'、[]、function（tx、results）{var len = results.rows.long.length、msg = <p> queryレコード番号： +len +</p>; }}、null）;}）;これらの操作から、基本的にSQLステートメントを使用してデータベースに関連する操作を実行できます。
5.indexeddbインデックスデータベース（indexedB）API（HTML5の一部として）は、リッチなデータ集中ストレージデータを備えたオフラインHTML5 Webアプリケーションを作成するのに役立ちます。同時に、ローカルキャッシュデータも役立つため、従来のオンラインWebアプリケーション（モバイルWebアプリケーションなど）がより速く実行および応答できるようになります。
非同期API：IndexEdDBの操作のほとんどは、結果の結果を返す一般的に使用される呼び出しメソッドではなく、データベース操作の開設などのリクエスト応答のモードです。
このようにして、データベースを開くと、実際にDBオブジェクトを返しましたが、このオブジェクトは結果でした。結果を除いて、上記の図からわかるように。いくつかの重要な属性は、Onerror、Onsuccess、Onupgradeneededです（データベースのバージョン番号と既存のデータベースバージョン番号を要求する場合）。これは、AJAXリクエストに似ています。このリクエストを開始した後、いつ成功したかを判断できなかったため、コールバックでロジックを処理する必要があります。
オフにして削除します： function closedb（db）{db.close（）;}関数deletedb（name）{indexeddb.deletedatabase（name）;}データストレージ：indexedDBには概念はありませんが、データベースには複数のオブジェクトストアが含まれています。言い換えれば、オブジェクトストアはテーブルに相当します。テーブルは、その中に保存されている各データに関連付けられています。
各レコードの指定されたフィールドをキー値（キーパス）として使用するか、自動生成数値をキー値（keygenrator）として使用するか、指定していないかを使用できます。さまざまな種類の選択キーを使用すると、オブジェクトストアが保存できるデータ構造も保存できます。
上記は、この記事のすべての内容です。