javascript - 如何使用 localStorage 记住在元素上设置了哪些类

Question

我将使用Mousetrap，因此当用户按下 Alt+L 时，它会使用 jQuery 并将类添加light到 body 标记，我还希望它在按下 Alt+L 后删除该类。

如何添加 localstorage 以记住是否有课程light？

Answer 1

我不会提供代码，因为它太简单了，我不需要。相反，我将为您提供使用文档的指导，这些文档将为您提供有关您请求信息的 api 的答案。

localStorage非常直截了当。这是一个简单的键/值存储。

https://developer.mozilla.org/en-US/docs/DOM/Storage

Mozilla 开发者网络将为您提供有关 api 的作用以及它们如何工作的信息（带有工作示例）。

我还想提一下，localStorageStackOverflow 上可能已经存在一些问题。这是关于 StackOverflow 的帖子 -修改本地存储？

欢迎。

---

为了匹配 OP 的 REAL 问题，“我如何使用 localStorage 来记住在元素上设置了哪些类”。

var $body = $("body");

// On ALT+L event
if ($body.hasClass("light")) {
    $body.addClass("light");
    window.localStorage.hasLightClass = true;
} else {
    window.localStorage.hasLightClass = false;
    $body.removeClass("light");
}

// On page load
var hasClass = window.localStorage.hasLightClass || false;
if (JSON.parse(hasClass)) {
  $body.addClass("light");
}