今回はHTML5の目玉機能としてのウェブストレージをご紹介します。
クッキーと比較されますが、断然にウェブストレージがいい！
ウェブもこれからますます便利になってきますね。ほとんど標準でアプリが準拠されているような感じすよね。
あまりプログラムが出来ない人でも簡単に扱いができるようになってきたようですね。
色々と扱えることが多くなっていいことです！
スポンサーリンク
クッキーの特徴
・クッキー1つ当たりの容量は4KB
・クッキーの個数は全部で300個
・1つのWebサーバーにつきクッキーは20個
・すべてのリクエストに対してサーバにデータを自動送信
・有効期間がある（無期限設定はない）
webstorageの特徴
・保存容量はブラウザに依存、各ブラウザにより様々ですが5MBぐらいは保存できそうです。
・ローカルストレージにはデータの保存期限はありません（明示的にクリアしない限りはずっと保存され続けます）。
・データを利用する時のみ送信（自動で送信しない）
・保存データは文字列のみ。
（1）sessionStorage
ウィンドウごとのセッションで有効なストレージ。ウィンドウを閉じると消える。
（2）localStorage
ブラウザ内に永続的にデータを保存するストレージ。
ローカルストレージについて使い方
値をセット
localStorageに値をセットするには、以下のようにします。
下記３行は同じ意味です。
localStorage.setItem(‘keyName’, ‘sampleValue’);
localStorage[‘keyName’] = ‘sampleValue’;
localStorage.keyName = ‘sampleValue’;
たったこれだけです。
値を取得
値を取得するには、以下のように単純です。
下記３行は同じ意味です。
data = localStorage.getItem(‘keyName’);
data = localStorage[‘keyName’];
data = localStorage.keyName;
値を削除するには、以下のように書きます。
localStorage.removeItem(‘keyName’);
すべてのデータを削除
そして、localStorage内のすべてのデータを削除するには、以下のように書きます。
localStorage.clear();
これで基本操作はすべてそろいました。
簡単ですねー。
今後はよりjavascriptが注目されるでしょうねーHTML5ととても密接な関係ですから。