0

Сделал что-то вроде темного режима по клику на кнопку. Тут принцип таков: есть 2 css-файла. 1 - light.css, 2 - dark.css (светлая и темная темы соответственно. Смена режимов работает при изменении значения атрибута href на теге link c ссылкой на css-файл. По нажатию на кнопку тему тема меняется, как и соответствующее значение в localStorage. Но совсем не выходит получать это значение из localStorage и записывать его в значение атрибута href сразу же после обновления страницы автоматически. В общем, пытаюсь сохранять выбранную тему после обновления страницы. Ниже указан код:

function ChangeTheme() {
    let lightTheme = 'css/light.css';
    let darkTheme = 'css/dark.css';
    var theme = '';

    var currentTheme = link.getAttribute('href');

    if (currentTheme == darkTheme) {
        currentTheme = lightTheme;
        theme = 'css/light.css';
    } else {
        currentTheme = darkTheme;
        theme = 'css/dark.css';
    }
    localStorage.setItem('href', theme);
    link.setAttribute('href', localStorage.getItem('href'));
}
2
  • Непонятно, откуда взялся link? Он объявлен выше? Где именно подключаются стили и скрипт? Уточните пожалуйста вопрос
    – SIA
    27 дек 2022 в 17:50
  • var btn = document.querySelector('#theme-button'); var link = document.querySelector('#theme-link'); <link rel="stylesheet" type="text/css" href id="theme-link"> Всё,объявлено, всё работает. И скрипты и стили, в html файле. Ты можешь просто помочь? При отправке вопросы эту часть не пропускало.
    – Sanders322
    27 дек 2022 в 17:57

1 ответ 1

0

Может не стоит изобретать очередной велосипед ? Вот рабочий вариант. Если хорошо покопаться, то можно найти ещё проще метод по запросу как включить темную тему js Там вообще без JS на переключениях переменных в СSS/ Если вам поддерживать только новые браузеры.

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.