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

Question

[MentozZz ORG]

Как сохранять нажатие на кнопку в 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');
            });

Answer 1

[Сергей delphinpro]

Для начала задайте идентификатор тегу с подключением стиля

<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);

Comments

[MentozZz ORG]

ошибка

[MentozZz ORG]

Uncaught TypeError: Cannot read property 'setAttribute' of null
at setTheme (script.js:10)
at script.js:23
setTheme @ script.js:10
(anonymous) @ script.js:23
6script.js:10 Uncaught TypeError: Cannot read property 'setAttribute' of null
at setTheme (script.js:10)
at HTMLElement. (script.js:14)
at HTMLElement.dispatch (jquery-1.11.2.js:4665)
at HTMLElement.elemData.handle (jquery-1.11.2.js:4333)
setTheme @ script.js:10
(anonymous) @ script.js:14
dispatch @ jquery-1.11.2.js:4665
elemData.handle @ jquery-1.11.2.js:4333

Answer 2

[Алексей Скляров]

Посмотрите в сторону: Create A Dark/Light Mode Switch with CSS Variables