Web Storage API

Web Storage API はブラウザ内にデータを保存および検索するためのシンプルな構文です。非常に使いやすいです：

インスタンス

localStorage.setItem("name", "Bill Gates");
localStorage.getItem("name");

実際に試してみてください

すべてのブラウザは Web Storage API をサポートしています：

Chrome IE Firefox Safari Opera
Chrome IE/Edge Firefox Safari Opera
サポート サポート サポート サポート サポート

localStorage オブジェクト

localStorage オブジェクトは特定のウェブサイトのローカルストレージへのアクセスを提供します。それは、データ項目の保存、読み取り、追加、修正、削除を行うことができます。

保存されたデータには到期日がなく、ブラウザが閉じられると削除されません。

これらのデータは数日、数週間、数年間利用可能です。

setItem() メソッド

localStorage.setItem() メソッドはデータ項目を storage に保存します。

名前と値をパラメータとして受け取ります：

インスタンス

localStorage.setItem("name", "Bill Gates");

getItem() メソッド

localStorage.getItem() メソッドはストレージ（storage）からデータ項目を検索します。

パラメータとして名前を受け取ります：

インスタンス

localStorage.getItem("name");

sessionStorage オブジェクト

sessionStorage オブジェクトは localStorage オブジェクトと同じです。

違いは sessionStorage オブジェクトがセッションのデータを保存することです。

ブラウザが閉じられると、データが削除されます。

インスタンス

sessionStorage.getItem("name");

実際に試してみてください

setItem() メソッド

sessionStorage.setItem() メソッドはデータ項目をストレージ（storage）に保存します。

名前と値をパラメータとして受け取ります：

インスタンス

sessionStorage.setItem("name", "Bill Gates");

getItem() メソッド

sessionStorage.getItem() メソッドはストレージ（storage）からデータ項目を検索します。

パラメータとして名前を受け取ります：

インスタンス

sessionStorage.getItem("name");

Storage オブジェクトの属性とメソッド

属性/メソッド 説明
key(n) ストレージ中の第 n 個キーの名前を返します。
length Storage オブジェクトに保存されているデータ項目の数を返します。
getItem(keyname) 指定されたキー名の値を返します。
setItem(keyname, value) キーをストレージに追加します。または、キーが既に存在する場合、キーの値を更新します。
removeItem(keyname) 指定されたキーをストレージから削除します。
clear() すべてのキーをクリアします。

Web Storage API 相関ページ

属性 説明
window.localStorage Web ブラウザでキー/値ペアを保存することを許可します。期限がないデータを保存します。
window.sessionStorage Web ブラウザでキー/値ペアを保存することを許可します。セッションのデータを保存します。