используя переменную javascript с localStorage

Question

У меня есть скрипт, который можно переключать с помощью переключателя, и я использую этот скрипт на разных страницах. Когда я переключаю переключатель на одной странице и go на следующую, я вижу, что переменная изменила свое значение по умолчанию. Я пытался использовать localStorage для хранения переменной, но это не сработало

сценарий без локального хранилища:

function toggleDarkMode() {  
  document.body.classList.toggle("dark-mode");
}

сценарий с локальным хранилищем:

function darkMode(){
    localStorage.setItem('dark-mode', document.body.classList.toggle("dark-mode"));
}

Правильно ли я сохраняю переменную, и если да, то как мне получить к ней доступ?

Answer 1

Вы правильно устанавливаете значение с помощью

function darkMode(){
    localStorage.setItem('dark-mode', document.body.classList.toggle("dark-mode"));
}

Чтобы прочитать значение, вы должны сделать это

let valueFromLocalStorage = localStorage.getItem('dark-mode');

Проверьте рабочую демонстрацию здесь

Подробнее о локальном хранилище можно прочитать здесь:

https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

Answer 2

Установка элемента в localStorage: localStorage.yourItem = yourValue;
Доступ к его значению позже: localStorage.yourItem;

function checkDarkMode () {
    if (localStorage.darkMode) {
        document.body.classList.add("dark-mode");
    } else {
        document.body.classList.remove("dark-mode");
    }
}

function toggleDarkMode () {
    localStorage.darkMode = !(localStorage.darkMode);
    checkDarkMode();
}

И вызов checkDarkMode после загрузки страницы.