javascript - 取消保存/重置本地存储中元素的用户编辑

Question

我似乎无法弄清楚如何从我正在尝试制作的网站规划器的本地存储中的单个元素中删除用户编辑。

计划表显示接下来的 7 天，用户可以为每一天添加注释。用户可以选择单独保存每天的笔记(通过按“保存日”按钮)，每天都有一个单独的元素保存到本地存储中，并且一切正常。我想为用户提供一种方法，通过按“重置日期”按钮来清除每一天的笔记，但我不知道如何做到这一点。我可以使用 localStorage.clear(); 一次清除所有内容，但我希望每个元素都能够单独清除。

<script>
function resetEdits1() {    
localStorage.removeItem("edit1");
}
</script>

我已经尝试过这个，但我认为这不适用于元素(例如“edit1”)。

<script>
function saveEdits1() { 
var editElem = document.getElementById("edit1");
var userVersion = editElem.innerHTML;
localStorage.userEdits1 = userVersion;
}
</script>

这就是我将元素保存到本地存储中的方法。我正在尝试扭转该过程，以返回到进行编辑并将其添加到本地存储之前元素的状态。

Answer 1

在给定的代码中，您从未设置 localStorage 项“edit1”。因此，如果它不存在，显然无法将其删除。您可能已设置的唯一 localStorage 项目是“userEdits1”。因此，您需要使用

localStorage.removeItem("userEdits1");

删除它。

我认为，再次了解如何从 localStorage 中设置、获取和删除项目会对您有所帮助。 This site可能对此有所帮助。