Помощь в коде для реализации функции Dark Theme на сайте

141

15 января 2022, 15:10

на странице моего сайта реализована функция "dark theme", но при перезагрузке все возвращается и поэтому нужна помощь, чтобы реализовать данную функцию с запоминанием при перезагрузке страницы.

Сам код:

$( document ).ready(function() {
  $("#rec151118133 , #rec151161108").hide();
  //При клике на кнопку меняющая тему
  $(".tn-elem__1323223061577054625340").click(function(e) {
     e.preventDefault();
     $("#rec146555799 , #rec151160077").toggle(0);
     $("#rec151118133 , #rec151161108").toggle(0);
     $("#rec151160077").toggleClass('toggle-search-color');
     $(".t838__input").toggleClass('toggle-search-color-2');
     $(".t-input_bbonly , .tn-elem__1512423361577100640696").toggleClass('toggle-add-post');
     $(".t-select").toggleClass('toggle-add-post-2');
     $(".tn-elem__1513684361577131971162 .tn-atom").toggleClass('toggle-button');
     $("#rec151365039 , .t026__title , #rec151368436 , .tn-elem__1513684361577130843955 .tn-atom").toggleClass('text-description-title-togle');
     $(".tn-elem__1487027281573013925462 .tn-atom , .tn-elem__1487027281573015546111 .tn-atom , .tn-elem__1487027281573014007001 .tn-atom , .tn-elem__1487027281573014313839 .tn-atom , .tn-elem__1487027281573014337112 .tn-atom , .tn-elem__1487027281573014337140 .tn-atom , .tn-elem__1487027281573014348005 .tn-atom , .tn-elem__1487027281573014348056 .tn-atom , .tn-elem__1512174771577094768879 .tn-atom , .tn-elem__1512174771577096290703 .tn-atom , .tn-elem__1512174771577096290734 .tn-atom , .tn-elem__1512174771577096290757 .tn-atom , .tn-elem__1512174771577096290782 .tn-atom , .tn-elem__1512174771577096290805 .tn-atom , .tn-elem__1512174771577096290830 .tn-atom").toggleClass('toggle-menu-color');
     $(".t-body , #rec132322306 .t396__artboard , #rec147792432 .t396__artboard , #rec147792432 , #rec147807555 .t396__artboard , #rec147807555 , #rec147853630 .t396__filter , #rec147857002 .t396__filter , #rec147857002 , #rec151242336 .t396__artboard , .tn-elem__1512423361577110147985 .tn-atom").toggleClass('background-toggle-blocks-elements');
     $("#rec147792432 a , .tn-elem__1478570021575818785356 .tn-atom , #rec147857002 a , .tn-elem__1477924321575800090588 .tn-atom , .tn-elem__1477924321575800582798 .tn-atom , .tn-elem__1477924321575800599856 .tn-atom , .tn-elem__1477924321575800616546 .tn-atom , .tn-elem__1477924321575800616578 .tn-atom , .tn-elem__1477924321575800590577 .tn-atom").toggleClass('toggle-text');
     $("#rec143125219 .t396__artboard , #rec147798335 .t396__artboard").toggleClass('toggle-line-color');
    });
});

Answer 1

Можно так.

$( document ).ready(function() {
  $("#rec151118133 , #rec151161108").hide();
  //При клике на кнопку меняющая тему
  $(".tn-elem__1323223061577054625340").click(function(e) {
     e.preventDefault();
     sessionStorage.setItem('theme', 'Dark');
    });
});
ThemeType = sessionStorage.getItem('theme');
//alert(ThemeType);
if (ThemeType == "Dark"){
    $("#rec146555799 , #rec151160077").toggle(0);
     $("#rec151118133 , #rec151161108").toggle(0);
     $("#rec151160077").toggleClass('toggle-search-color');
     $(".t838__input").toggleClass('toggle-search-color-2');
     $(".t-input_bbonly , .tn-elem__1512423361577100640696").toggleClass('toggle-add-post');
     $(".t-select").toggleClass('toggle-add-post-2');
     $(".tn-elem__1513684361577131971162 .tn-atom").toggleClass('toggle-button');
     $("#rec151365039 , .t026__title , #rec151368436 , .tn-elem__1513684361577130843955 .tn-atom").toggleClass('text-description-title-togle');
     $(".tn-elem__1487027281573013925462 .tn-atom , .tn-elem__1487027281573015546111 .tn-atom , .tn-elem__1487027281573014007001 .tn-atom , .tn-elem__1487027281573014313839 .tn-atom , .tn-elem__1487027281573014337112 .tn-atom , .tn-elem__1487027281573014337140 .tn-atom , .tn-elem__1487027281573014348005 .tn-atom , .tn-elem__1487027281573014348056 .tn-atom , .tn-elem__1512174771577094768879 .tn-atom , .tn-elem__1512174771577096290703 .tn-atom , .tn-elem__1512174771577096290734 .tn-atom , .tn-elem__1512174771577096290757 .tn-atom , .tn-elem__1512174771577096290782 .tn-atom , .tn-elem__1512174771577096290805 .tn-atom , .tn-elem__1512174771577096290830 .tn-atom").toggleClass('toggle-menu-color');
     $(".t-body , #rec132322306 .t396__artboard , #rec147792432 .t396__artboard , #rec147792432 , #rec147807555 .t396__artboard , #rec147807555 , #rec147853630 .t396__filter , #rec147857002 .t396__filter , #rec147857002 , #rec151242336 .t396__artboard , .tn-elem__1512423361577110147985 .tn-atom").toggleClass('background-toggle-blocks-elements');
     $("#rec147792432 a , .tn-elem__1478570021575818785356 .tn-atom , #rec147857002 a , .tn-elem__1477924321575800090588 .tn-atom , .tn-elem__1477924321575800582798 .tn-atom , .tn-elem__1477924321575800599856 .tn-atom , .tn-elem__1477924321575800616546 .tn-atom , .tn-elem__1477924321575800616578 .tn-atom , .tn-elem__1477924321575800590577 .tn-atom").toggleClass('toggle-text');
     $("#rec143125219 .t396__artboard , #rec147798335 .t396__artboard").toggleClass('toggle-line-color');
}

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

вычисление ряда суммы числа слагаемых

Вот задание: для всех значений X, задаваемых параметрами из набора: начальное значение А, конечное значение В, шаг Dx, количество шагов N x, ограничение...

157

HTML