这几天在写一个小玩意儿,然后起义要写个日夜切换,刚好又在这里发现了一个 大牛写的根据时间来设置,但是发现切换后刷新就没了,所以感觉作用不大,我就自己写了个刷新不会变的,哈哈哈
首先说明,本人对前端不是很熟,要是代码有毛病或者不规则还请包含哦!
var $$ = mdui.$;
// 日夜切换
function change_style() {
// 先判断body里面是否包含mdui-theme-layout-dark这个类
if ($$('body').hasClass('mdui-theme-layout-dark')) {
// 如果包含这个类的话,就删除这个类
$$('body').removeClass('mdui-theme-layout-dark');
// 并设置浏览器存储
localStorage.setItem("change_theme", '2');
} else {
// 如果包含这个类的话,就添加这个类
$$('body').addClass('mdui-theme-layout-dark');
// 并且把存储值改成1
localStorage.setItem("change_theme", '1');
}
}
// 那么接下来就是判断存储的值了
// 假设值等于1,那我们就添加这个类
// 不然的话就删掉这个类
// 注意: 这一段是防止刷新之后恢复原来的颜色
if (localStorage.getItem("change_theme") == '1') {
$$('body').addClass('mdui-theme-layout-dark');
} else {
$$('body').removeClass('mdui-theme-layout-dark');
}
就是这样了,不好别骂我,只是分享一下