注意点

先頭でも記述したがWeb Storageに保存できるのは文字列データである。したがってWeb Storageにオブジェクトを格納すると、自動的に行われる文字列変換でほとんどの場合もとのオブジェクトに含まれていた情報のかなりの部分が失われてしまい、取り出した際に意図通りに復元することができなくなる。 そこで、こうした場合には、JSON形式に変換する「JSON.stringify(value)」メソッドとJSON形式から復元する「JSON.parse(text)」メソッドを使用する。

JSON.stringify

// colorvalueをキーにしてweb storageに格納
var value = {'red':'赤','green':'緑','blue':'青'};
// オブジェクトをJSON形式に変換
var json_value = JSON.stringify(value);
localStorage.setItem('colorvalue',json_value);

JSON.parse

// キーcolorvalueに登録されている値を取得
var json_value = localStorage.getItem('colorvalue');
// JSON形式からオブジェクトに変換
value = JSON.parse(json_value);
var red = value.red;
var green = value.green;
var blue =  value.blue;

IEでの注意点
IEでローカルのHTMLファイルを直接実行した場合(つまりエクスプローラでHTMLファイルをダブルクリックして実行した場合)、localStorageオブジェクトやsessionStorageオブジェクトを取得できない。
つまりWebStorageを使ない。
Webサーバー経由で実行すれば問題なく使える。