HTML5と共に標準化が進められているAPIの中にWeb Storageがあります。
Web Storageを利用すると、ローカルディスク上にデータの保存が可能となります。
Cookieと異なり有効期限がないので、データを永続的に保存することができます。

Web Storageにはローカルストレージ、セッションストレージの二種類があります。

• ローカルストレージは永続的にデータの保存が可能
• セッションストレージはブラウザを開いている間のみデータの保存が可能

使い方は簡単で、データの読み書きは以下になります。

[保存]
[javascript]
localStorage.setItem(key, value);
[/javascript]

[読み込み]
[javascript]
ret = localStorage.getItem(key);
[/javascript]

上記のように、メソッドを呼び出してデータの読み書きできますが、配列、プロパティ形式でも利用可能です。

[javascript]
localStorage.setItem(“key_dayo”, “value_dayo”);
localStorage.key_dayo = “value_dayo”;
localStorage[“key_dayo”] = “value_dayo”;
[/javascript]

このローカルストレージを利用し、下の画像のような簡単なサンプル(簡易メモ)を作成してみました。

「保存」ボタンを押すことで、テキストエリア内に記述した文字列をローカルストレージに保存します。
「読込」 ボタンを押すとローカルストレージに保存した、文字列をテキストエリア内に表示することができます。

簡易メモ

Web StorageはCookieと同じく手軽にデータを保存できる便利なAPIです。
Web Strageを利用することで、使い勝手のいいWebページを作成できると思います。
ブラウザの対応状況がマチマチなので、その辺りを考慮して作成する必要がありますが、ぜひ利用してみてはいかがでしょうか。