localStorageのサンプルコード

<script >
  log('=== 実験開始 ===');
  log('> アイテム数をカウント');
  log(localStorage.length);

  log('> ローカルストレージにキーと値を保存する。');

  localStorage.mango = 'マンゴー';
  localStorage.banana = 'バナナ';

  log('> ローカルストレージの値を取り出す');
  log(localStorage.mango);  // マンゴー
  log(localStorage.banana); // バナナ
  
  
  log('> インデックス(添字)を使ってキーを取り出す。');
  log(localStorage.key(0)); // mango
  log(localStorage.key(1)); // banana

  log('> キーの一覧を列挙する');
  
  for(var i = 0; i < localStorage.length ; i++) {
    log(localStorage.key(i));    // 'mango', 'banana',
  }

  /* 下記はエラー！　Chromeでは動くが、Firefoxでは動かない。 */
  /*
  for(var j in localStorage) {
    log(j);
  }
  
  */

  log('> 値の一覧を列挙する');
  for(var i = 0; i < localStorage.length ; i++) {
    log(localStorage[localStorage.key(i)]);    // 'マンゴー','バナナ'
  }


  log('> メソッド経由で値をセット＆ゲット');
  log('> アイテムappleを追加');
  localStorage.setItem('apple', 'りんご');
  log(localStorage.getItem('apple')); // りんご
  
  log('> アイテム数をカウント');
  log(localStorage.length);  // 3

  log('> キーの一覧を列挙する');
  
  for(var i = 0; i < localStorage.length ; i++) {
    log(localStorage.key(i));    // 'mango', 'banana', 'appple'
  }

  log('> アイテムmangoを削除');
  localStorage.removeItem('mango');

  log('> アイテム数をカウント');
  log(localStorage.length);  // 2

  log('> 全アイテムを削除');
  localStorage.clear();


  log('> アイテム数をカウント');
  log(localStorage.length);  // 0

function log(string)
{
    document.write(string + "<br />\n");
}

</script>

FireFoxのローカルストレージの注意点

参考