JavaScript
webstorage
sessionStorage

sessionStorageを使ってブラウザにデータを持たせよう!

More than 1 year has passed since last update.

sessionStorageとは

sessionStorageとは HTML5から導入されたWebStorageという仕組みを利用し、JavaScriptを使ってブラウザにデータを保持できる仕組みです。
WebStorageには二通りあって localStoragesessionStorageが存在します。
この記事ではsessionStorageを使います!

localStorageとsessionStorageの違い

  • WebStorage
    • localStorage ブラウザを閉じたり再び開いたりしても持続します。
    • sessionStorage ページのセッション中 (ページの再読み込みや復元を含む、ブラウザを開いている間) に使用可能な、生成元ごとに区切られた保存領域を管理します。

対応ブラウザについて

対応ブラウザは以下のリンクのブラウザ実装状況を確認してください。
Web Storage API

使い方について

値を保存する際はkeyとvalueを使い、取得・削除する際はkeyを指定して操作します。

保存

sessionStorge.key = 'value'
または
sessionStorage['key'] = 'value'
または
sessionStorage.setItem('key', 'value')

取得

sessionStorge.getItem('key')

削除

sessionStorge.removeItem('key')

初期化

sessionStorage.clear()

最後に

上記のようにsessionStorageを使ってブラウザにデータを持たせることができます:thumbsup:
良いsessionStorageライフを:sunny: