在所有页面上传播暗模式更改

是否可以在不更改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();
    }
});
qhslz 回答:在所有页面上传播暗模式更改

您的问题似乎有一个可行的解决方案。您可以将代码简单地放入$(document).read()语句中,并在用户加载页面后将其实现。

或者,您可以设置计时器以检查darkMode变量的值并在更改时进行更新。

本文链接:https://www.f2er.com/3156622.html

大家都在问