WebStorageについて（HTML）
勉強したはずなのにズッコケた、
Webデザイン技能検定の筆記試験復習シリーズ。
（令和元年度第３回）
HTML5のAPIであるWeb Storageについて。
（１）sessionStorageについて
key-value型のデータ保存形式
データ：ウィンドウやタブを閉じるまで有効
別ウィンドウでのデータ共有：×
ウィンドウ間でデータが共有されることはない。
（２）localStorageについて
key-value型のデータ保存形式
データ：永続的に有効
別ウィンドウでのデータ共有：〇
「http://www.example.com:80」のような
「プロトコル://ドメイン名:ポート番号」（オリジン）
単位で有効なため、アドレスが同じであれば
ウィンドウ別でもデータは共有できる。
ブラウザを終了してもデータは保存される。
（３）Cookieとの違い
データの有効期限が「ウィンドウ単位」「永続的」でなく
「一定期間」（時間単位）
（４）APIへの命令の出し方
①getItem(key)
keyに対応するvalueを取得する
②setItem(key, value)
keyとvalueをペアにしてデータを保存する
③removeItem(key)
keyに対応するvalueを削除する
④clear()
データをすべてクリアする
⑤length
保存されているデータの数を返す
⑥key(n)
保存されているn番目のkeyを返す
（例）
//変数storageにsessionStorageを格納
var storage = sessionStorage;
//useridというキーに1111という値を割り当てて保存
storage.setItem('userid', '1111');
//後からvalueを変更してセットし直せば上書き保存される
storage.setItem('userid', '2222');
//useridというキーの値を取得する（2222が返るはず）
storage.getItem('userid');
//useridというキーの値を削除する
storage.removeItem('userid');
//ストレージに保存されているデータをすべてクリアする
storage.clear();【出典】