如何使我的页面可以关闭或重新加载，但当我再次打开页面时内容不会消失？

Question

这是 JavaScript 代码，但我认为它不会有太大帮助，因为它没有任何与页面重新加载相关的内容，因为我以前没有这样做过。每次我重新加载页面时，待办事项列表中的任何项目都不会保存并在重新加载后消失。

JS：

// Create a "close" button and append it to each list item
var myNodelist = document.getElementsByTagName("LI");
var i;
for (i = 0; i < myNodelist.length; i++) {
  var span = document.createElement("SPAN");
  var txt = document.createTextNode("\u00D7");
  span.className = "close";
  span.appendChild(txt);
  myNodelist[i].appendChild(span);
}

// Click on a close button to hide the current list item
var close = document.getElementsByClassName("close");
var i;
for (i = 0; i < close.length; i++) {
  close[i].onclick = function() {
    var div = this.parentElement;
    div.style.display = "none";
  }
}

// Add a "checked" symbol when clicking on a list item
var list = document.querySelector('ul');
list.addEventListener('click', function(ev) {
  if (ev.target.tagName === 'LI') {
    ev.target.classList.toggle('checked');
  }
}, false);

// Create a new list item when clicking on the "Add" button
function newElement() {
  var li = document.createElement("li");
  var inputValue = document.getElementById("myInput").value;
  var t = document.createTextNode(inputValue);
  li.appendChild(t);
  if (inputValue === '') {
    alert("You must write something!");
  } else {
    document.getElementById("myUL").appendChild(li);
  }
  document.getElementById("myInput").value = "";

  var span = document.createElement("SPAN");
  var txt = document.createTextNode("\u00D7");
  span.className = "close";
  span.appendChild(txt);
  li.appendChild(span);

  for (i = 0; i < close.length; i++) {
    close[i].onclick = function() {
      var div = this.parentElement;
      div.style.display = "none";
    }
  }
}

Answer 1

2 个现代且易于使用的解决方案如下：

• 网络存储 API。它提供了一种存储和检索由名称和相应值组成的较小数据项的机制。当您只需要存储一些简单的数据时，这很有用，例如用户名、他们是否登录、屏幕背景使用什么颜色等。

• 索引数据库 API。它为浏览器提供了一个完整的数据库系统，用于存储复杂的数据。这可用于从完整的客户记录集到复杂的数据类型（如音频或视频文件）。

查看此页面上的示例：https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Client-side_web_APIs/Client-side_storage

一旦我有一台电脑可以编辑这个答案以包含示例。