localStorage で保存する

JavaScriptでWebページを動かす / 全 5 枚

JavaScriptでWebページを動かす - localStorage で保存する

変数はページを閉じると消える

ダークモードに切り替えても、ページを開き直すと元に戻ってしまいます。変数はページが読み込み直された時点で作り直されるからです。次に来たときも同じ設定で始めたいなら、ブラウザ側に預けておきます。その預かり所が localStorage です。

預けられるのは文字列だけです。ここが最初のつまずきどころになります。

名前を付けて預け、同じ名前で取り出す。これだけの仕組みです。

localStorage.setItem("theme", "dark");

const theme = localStorage.getItem("theme"); // "dark"

1 / 5

← → キーでも送れます