@Gor_Ohanyan

Как сохранять нажатие на кнопку в localstorage?

Как сохранять нажатие на кнопку в local storage или cooke

вот html
<div class="theme-kn">
                <i class="fa-solid fa-lightbulb-on theme-i getdark" aria-hidden="true"></i><i class="fa-solid fa-lightbulb-slash theme-i getlight"></i>
		</div>


вот js

$('.getlight').click(function () {
                $('link[href="templates/gor/css/light.css"]').attr('href', 'templates/gor/css/dark.css');
            });
$('.getdark').click(function () {
                $('link[href="templates/gor/css/dark.css"]').attr('href', 'templates/gor/css/light.css');
            });
  • Вопрос задан
  • 531 просмотр
Пригласить эксперта
Ответы на вопрос 2
delphinpro
@delphinpro Куратор тега JavaScript
frontend developer
Для начала задайте идентификатор тегу с подключением стиля

<link id="theme" href="templates/gor/css/light.css">


Потом определите функцию

function setTheme(theme) {
  document.getElementById('theme').setAttribute('href', `templates/gor/css/${theme}.css`);
}


Потом можете использовать ее

$('.getlight').on('click', function () {
  setTheme('light');
  localStorage.setItem('selectedTheme', 'light'); // Запомнить
});
$('.getdark').on('click', function () {
  setTheme('dark');
  localStorage.setItem('selectedTheme', 'dark'); // Запомнить
});


и установите тему выбранную тему при загрузке страницы

const selectedTheme = localStorage.getItem('selectedTheme') ?? 'light';
setTheme(selectedTheme);
Ответ написан
Посмотрите в сторону: Create A Dark/Light Mode Switch with CSS Variables
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы