Я создал скрипт, который каждый раз, когда я нажимаю кнопку «Темный режим», меняет цвета фона HTML-элементов, сохраняет их в локальном хранилище, поэтому каждый раз, когда пользователи просматривают разные страницы сайта, они видяттакие же цветаКод работал нормально, но сегодня я снова проверил его и увидел, что он не работает.Я мог изменить цвета, но когда я обновил страницу, цвета исчезли.Он вернулся к первоначальным цветам.Я очистил историю браузера, который посетил страницу, нажал кнопку, чтобы изменить цвета, и проверил локальное хранилище, а значения не были отправлены и сохранены.Я не знаю, почему это произошло.Я ничего не изменил в своем коде.Единственное, что я сделал, это добавил на сайт два плагина (это WordPress).Я не понимаю, как это может повлиять на мой сценарий.Вот код:
jQuery(document).ready(function($){
$(window).on("load", function() {
setTimeout(function() {
if (typeof(localStorage) == 'undefined') {
alert("Your browser does not support HTML5 localStorage. Try upgrading.")
} else {
if (localStorage.getItem("favBody") != null && localStorage.getItem("favHeader") != null
&& localStorage.getItem("fav") != null && localStorage.getItem("toolbar") != null &&
localStorage.getItem("makePost") != null && localStorage.getItem("typeOfPost") != null &&
localStorage.getItem('streamFilter') != null && localStorage.getItem('streamPost') != null
&& localStorage.getItem('toggleIcon') != null) {
getFavBody = localStorage.favBody;
getFavHeader = localStorage.favHeader;
getFav = localStorage.fav;
getFavTool = localStorage.toolbar;
getFavMakePost = localStorage.makePost;
getFavPostType = localStorage.typeOfPost;
getFavStreamFilter = localStorage.streamFilter;
getFavStreamPost = localStorage.streamPost;
getFavToggleIcon = localStorage.toggleIcon;
$('#body').addClass('nightmode');
$('.header').addClass('headerNightmode');
$(".widget--box").addClass('widget-darkmode');
$(".ps-toolbar").addClass('toolbar-darkMode');
$(".ps-postbox-content").addClass('postBox');
$(".ps-postbox-tab").addClass('post-type');
$(".ps-stream__filters").addClass('darkStreamFilter');
$(".ps-stream").addClass('activityPost');
$(".ps-media-grid-item").addClass('activityPost');
$(".gc-icon-bars").addClass('iconToggle');
}
}
var button = $('.menu-item-178 a');
//var container = $('#custom-body').toggleClass(window.localStorage.toggled);
//var containerHeader = $('#custom-header').toggleClass(window.localStorage.toggledHeader);
/* Write your Public custom_public jQuery here! */
button.on('click', function (event) {
event.preventDefault();
getFavBody = localStorage.favBody;
getFavHeader = localStorage.favHeader;
getFav = localStorage.fav;
getFavTool = localStorage.toolbar;
getFavMakePost = localStorage.makePost;
getFavPostType = localStorage.typeOfPost;
getFavStreamFilter = localStorage.streamFilter;
getFavStreamPost = localStorage.streamPost;
getFavToggleIcon = localStorage.toggleIcon;
$('#body').toggleClass('nightmode');
$('.header').toggleClass('headerNightmode');
$(".widget--box").toggleClass('widget-darkmode');
$(".ps-toolbar").toggleClass('toolbar-darkMode');
$(".ps-postbox-content").toggleClass('postBox');
$(".ps-postbox-tab").toggleClass('post-type');
$(".ps-stream__filters").toggleClass('darkStreamFilter');
$(".ps-stream").toggleClass('activityPost');
$(".ps-media-grid-item").toggleClass('activityPost');
$(".gc-icon-bars").toggleClass('iconToggle');
if ($("#body").hasClass('nightmode') && $(".header").hasClass('headerNightmode') && $(".widget--box").hasClass('widget-darkmode') && $(".ps-toolbar").hasClass('toolbar-darkMode') &&
$(".ps-postbox-content").hasClass('postBox') && $(".ps-postbox-tab").hasClass('post-type') &&
$(".ps-stream__filters").hasClass('darkStreamFilter') && $(".ps-stream").hasClass('activityPost')
&& $(".ps-media-grid-item").hasClass('activityPost') && $(".gc-icon-bars").hasClass('iconToggle')) {
localStorage.setItem('favBody', 'nightmode');
localStorage.setItem('favHeader', 'headerNightmode');
localStorage.setItem('fav', 'widget-darkmode');
localStorage.setItem('toolbar', 'toolbar-darkMode');
localStorage.setItem('makePost', 'postBox');
localStorage.setItem('typeOfPost', 'post-type');
localStorage.setItem('streamFilter', 'darkStreamFilter');
localStorage.setItem('streamPost', 'activityPost');
localStorage.setItem('toggleIcon', 'iconToggle');
} else {
localStorage.removeItem('favBody');
localStorage.removeItem('favHeader');
localStorage.removeItem('fav');
localStorage.removeItem('toolbar');
localStorage.removeItem('makePost');
localStorage.removeItem('typeOfPost');
localStorage.removeItem('streamFilter');
localStorage.removeItem('streamPost');
localStorage.removeItem('iconToggle');
}
});
var target = $( "#ps-activitystream")[0];
//var target2 = $( ".custom-activity");
var mutationObserver = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
var newNodes = mutation.addedNodes; // DOM NodeList
if( newNodes !== null ) { // If there are new nodes added
var $nodes = $( newNodes ); // jQuery set
$nodes.each(function() {
var $node = $( this );
if( $node.hasClass( "ps-stream") || $node.hasClass(".ps-media-grid-item")) {
// do something
console.log(mutation);
if (localStorage.getItem('streamPost') != null) {
getFavStream = localStorage.favStream;
$(".ps-stream").addClass('activityPost');
$(".ps-media-grid-item").addClass('activityPost');
} else {
$(".ps-stream").removeClass('activityPost');
$(".ps-media-grid-item").removeClass('activityPost');
}
//var button2 = $('.menu-item-178 a');
}
});
}
});
});
// Starts listening for changes in the root HTML element of the page.
mutationObserver.observe(target, {
attributes: true,
characterData: true,
childList: true,
});
}, 500);
});
}); // document ready