Question

我正在学习有关浏览器本地存储的知识，不确定这是否是正确的方法。但是这是我创造的笔。 Codepen

HTML

<button id="switch">Turn lights off</button>

CSS

.light-on {
  background: #000;
}

JS

 $(document).ready(function() {
  $('#switch').click(function() {
    $('body').toggleClass('light-on');
  });
});

当人们重新访问该网站时，或者当它是一个真实的网站，并且用户在页面之间导航时，我希望黑背景（灯熄灭时）留在那里，我不想丢失用户所做的更改。

使用Javascript可以吗？

Answer 1

HTML

    <body onload="myFunction()">

JS：

    $(document).ready(function() {
       $('#switch').click(function() {
          $('body').toggleClass('light-on');
           window.localStorage.setItem("bkColor", "#theCurrentColor");
       });
    });      

    func myFunction() {

       if (window.localStorage.getItem("bkColor") != null) {
             document.body.style.backgroundColor = window.localStorage.getItem("bkColor");
        }

    }

在浏览器中保存用户动作的Javascript方法

1 个答案: