时间戳

首页 > 解决方案 > 使用 localStorage 的待办事项列表

javascript - 使用 localStorage 的待办事项列表

问题描述

我做了一个简单的待办事项清单。但我想让一个列表元素有一个 text-decoration = line-through

当我单击该按钮时，列表项将采用直通样式，即使我刷新页面或在新请求中返回它（我认为需要本地存储），它仍将保持直通。

我以为我可以使用 javascript 添加一个类，但我找不到如何使用本地存储来做到这一点。

以下是我尝试过的：

HTML：

<ul id="a2">
   <li>Make a ramen</li>
</ul>
<button type="button" id="ka" onclick="laylay()" class="" name="button">A</button>

CSS：

.done {
  text-decoration: line-through;
}

JS：

function laylay() {
var as = document.getElementById("a2");
  as.classList.add("done");
}

标签： javascripthtmlcss

解决方案

尝试获取元素的 HTML document.querySelector("#a2").innerHTML;，并将其作为字符串保存在 localStorage 中。而当你需要再次加载时，尝试检查它是否存在于localStorage中，然后该字符串将被设置为innerHTML#a2

推荐阅读