将用户输入（ul）存储在待办事项列表中，以便在重新打开程序时出现该列表

Question

我正在为我父亲的老板设计一个项目。我使用HTML，JS和CSS创建了一个待办事项列表。我真的在如何制作文件方面没有用，这样他输入的内容列表会自动保存，这样，如果他关闭文件，则在打开文件时列表仍然存在

我不希望任何人为我编写代码。我不想让任何人为我编写代码，因为我真的想学习如何更有效地思考这些事情，但是如果有人可以帮助我尽管我需要做的事情，我将不胜感激。

Answer 1

看起来您想要做的是一个能够存储信息的Web应用程序，在这种情况下，您的信息就是您提到的TODO列表。例如，您可以将此信息存储在database或.txt中。之后，下一步是填充每次加载html页面时创建的列表，以保存新信息，您可以在js中设置event并将信息保存在后台。当然，要做到这一切，您需要对我提到的要点进行一些研究。

Answer 2

听起来您的应用程序不涉及任何服务器端逻辑，所以我只讨论客户端选项：

当待办事项列表更改时，您需要存储内容并在重新访问/加载页面时再次加载。因此，您基本上可以选择将数据保存到Cookie或本地存储中。 Cookies旨在保存客户端的小数据，并在每次请求时将该数据传输到服务器。 Cookies通常也只有有限的生存时间才能删除。Localstorage可以在客户端存储更大的数据，不会随每个请求一起发送到服务器，通常不会像cookie一样快地被删除。所以我想我更喜欢使用localstorage。

关于写入和读取Cookie和本地存储方面有很好的参考。

本地存储

请参见https://developer.mozilla.org/de/docs/Web/API/Window/localStorage

localStorage.setItem('myCat', 'Tom');
...
var cat = localStorage.getItem('myCat');

Cookies

请参见https://www.w3schools.com/js/js_cookies.asp

document.cookie = "username=John Doe; expires=Thu, 18 Dec 2013 12:00:00 UTC";
...
var x = document.cookie;

但是您应该理解，只要您依赖于将数据保存到客户端，数据就将在其他浏览器中不可用（例如，您在chrome中工作，现在在firefox中打开页面）。

长期以来，您应该考虑传输并保存数据服务器端。如果您坚持使用纯客户端方法，我建议实现将待办事项列表另存为下载选项。否则删除浏览器数据可能会导致您所有待办事项列表丢失。