function myFunction() {
{
var element = document.getElementById("body");
element.classList.toggle("bdark");
}
{
var element = document.getElementById("theader");
element.classList.toggle("hdark");
}
{
var element = document.getElementById("sh");
element.classList.toggle("shh");
}
{
var x = document.getElementById("hs");
if (x.style.display === "block") {
x.style.display = "none";
} else {
x.style.display = "block";
}
}
}.bdark {
background-color: #333;
color: white;
}
.hdark {
background-color: black;
color: white;
}
.shh {
display: none;
}
.hs {
display: none;
}<body id="body" class="light">
<p id="theader">Click the "Try it" button to toggle between adding and removing the class names</p>
<button onclick="myFunction()">Try it</button>
<div id="myDIV">
This is a DIV element.
</div>
<div>
<div id="sh" class="sh">dark black</div>
<div id="hs" class="hs">light white</div>
</div>我希望它的类被保存，这样当我刷新或重新打开页面时，它将是和我离开时相同的类。或者一些工作相同的替代代码。感谢您阅读本文。：(
您可以使用本地存储。它很简单，比饼干好吃。
例如设置元素bg颜色(加载时(：
if(localStorage.getItem("color") == "black") {
element.classList.add("dark"); }
在您的功能上添加：
localStorage.setItem("color",black or white )
注意：您应该在函数上添加一个if语句，以检查类可用集本地存储项是否设置为黑色或非
将其添加到jquery文件的末尾(Mrbg=>mr babak golbaharan:(
$.extend({
MrbgSetCookie:function(name,value,days){
var expires = '';
if (days) {
var date = new Date();
date.setTime(date.getTime() + (days*24*60*60*1000));
expires = "; expires=" + date.toUTCString();
}
document.cookie = name + "=" + (value || "") + expires + "; path=/";
},
MrbgGetCookie:function(name){
var nameEQ = name + "=";
var ca = document.cookie.split(';');
for(var i=0;i < ca.length;i++) {
var c = ca[i];
while (c.charAt(0)==' ')
c = c.substring(1,c.length);
if (c.indexOf(nameEQ) == 0)
return c.substring(nameEQ.length,c.length);
}
return null;
},
MrbgRemoveCookie:function(name){
document.cookie = name+'=; Max-Age=-99999999;';
},
});
现在您可以将其用于设置、获取和删除cookie比如这个
$.MrbgSetCookie( 'cookieName', 'cookieValue' , 'period in day' );
在这种情况下：
element = document.getElementById("body");
element.classList.toggle("bdark");
( element.classList.contains('bdark') )?
$.MrbgSetCookie( yourElementID, 'bdark' , 365 ):
$.MrbgRemoveCookie(yourElementID );