如何解决如何通过 jQuery 在本地存储中保存暗模式?
我需要帮助....
如何在本地存储中保存暗模式?
我的js代码:
$(function() {
$("body").append("<button class='Nightbtn' onclick='DarkMode()'><img src='/Assets/Imgs/Png/night.png' alt=''></button>")
});
function DarkMode() {
let element = document.body;
element.classList.toggle("Night");
}
请帮忙
解决方法
您要做的实际上有两部分 - 保存 darkmode
状态和重新加载页面时加载相同的状态。
我尝试将其创建为 snippet
,但奇怪的是一直得到 script error
,但没有详细信息,但它在本地运行良好。感兴趣的两种方法是 getItem
和 setItem
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8' />
<title></title>
<style>
.Night{
background:black;
color:white;
}
</style>
<script src='//code.jquery.com/jquery-latest.js'></script>
<script>
const _store='darkmode';
const _class='Night';
function DarkMode() {
document.body.classList.toggle( _class );
localStorage.setItem( _store,document.body.classList.contains( _class ) ? 1 : 0 )
}
$(document).ready(()=>{
$('body').append("<button class='Nightbtn' onclick='DarkMode()'><img src='/Assets/Imgs/Png/night.png' alt=''></button>");
let dm=localStorage.getItem( _store );
if( Number(dm)==1 )document.body.classList.add( _class );
})
</script>
</head>
<body>
<!-- content -->
</body>
</html>
,
将您的模式存储为存储!
localStorage.setItem("Night",true);
得到
localStorage.getItem('Night')
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。