Распространение темного режима меняется на всех страницах

Question

Есть ли способ получить изменения включения / отключения темного режима для распространения на всех страницах моего сайта без изменения CSS?

Мой код jQuery.js

onload = function() {
    if(localStorage.getItem("darkMode") === "true") {
        var mode = localStorage.getItem("darkMode");
        enableDarkMode();
    }
}

function enableDarkMode() {
    $( "body" ).addClass( "dark" );
    $( "nav" ).removeClass( "navbar navbar-expand-md navbar-light");
    $( "nav" ).addClass( "navbar navbar-expand-md navbar-dark");
    $( '.inner-switch' ).text( "ON" );
    var mode = localStorage.setItem("darkMode", "true");
}

function disableDarkMode() {
    $( "body" ).removeClass( "dark" );
    $( "nav" ).removeClass( "navbar navbar-expand-md navbar-dark");
    $( "nav" ).addClass( "navbar navbar-expand-md navbar-light");
    $( '.inner-switch' ).text( "OFF" );
    var mode = localStorage.setItem("darkMode", "false");
}

$( '.inner-switch' ).on("click", function() {
    if( $( "body" ).hasClass( "dark" )) {
        disableDarkMode();
    } else {
        enableDarkMode();
    }
});

Answer 1

Похоже, у вас есть рабочее решение в вашем вопросе. Вы можете просто поместить этот код в оператор $ (document) .read () и реализовать его, как только пользователь загрузит страницу.

В качестве альтернативы, вы можете установить таймер для проверки значения вашей переменной darkMode иобновление при изменении.