Javascript 将项目存储到本地存储似乎不起作用

我正在为自己制作todo应用程序。并尝试将数据保存在本地存储器中。如果我做错了什么，我只想问一下我的代码

my html :

const addItems=document.querySelector（'.addItems'）；
const items=JSON.parse（localStorage.getItem（'items'））| |[]；
函数附加项（e）{
e、 预防默认值（）；
让todo=document.querySelector（'#todo'）；
让输入=（this.querySelector（'[name=item]'）.value）；
让text=document.createTextNode（输入）；
让标记=`${input}`；
todo.insertAdjacentHTML（'beforeend'，markup）；
常数项={
任务：输入
};
项目。推送（项目）；
setItem（'items'，JSON.stringify（items））；
这是reset（）；
}
addItems.addEventListener（“提交”，addItem）；

实际上，存储到localStorage中的项目最初没有绑定到html dom，这就是为什么您无法在视图中查看localStorage中的项目

[http://jsfiddle.net/r76xots2/9/]

下面是代码的工作链接，其中包含一些优化，我创建了一个公共函数，它将从localStorage更新dom，每当需要更新时都可以使用localStorage

---

我还创建了一个检查，因此同一项目不能插入两次。如果您不需要，您可以删除或注释它。

我已经检查了您的代码，它成功地将数据存储到本地存储中。我唯一能建议您的是，请为您的待办事项提供一个id。当您尝试删除项目时，它的效率非常高，操作或处理大型数据/应用程序。我知道它是存储的，但当我刷新页面时，页面上插入的html就消失了。我最近找到了一个解决方案，并修改了我的代码。但是谢谢anyway@codeHysteria-如果你想说“谢谢”，请把Senthur的回答投上一票。我们是一个社区，我们需要有意义地相互感谢。谢谢。@codehestria如果我的回答有帮助，请进行一次投票，这将鼓励像我这样的新贡献者分享知识并回答更多问题

my javascript:

    const addItems = document.querySelector('.add-items'); 
    const items = JSON.parse(localStorage.getItem('items')) || [];

    function addItem(e) {
        e.preventDefault();
        let todo = document.querySelector('#todo');
        let input = (this.querySelector('[name=item]').value);
        let text = document.createTextNode(input);
        let markup = `<center><div class="task">${input}<i class="far fa-check-circle"></i><i class="far fa-trash-alt" id="trash"></i></div></center>`;
        todo.insertAdjacentHTML('beforeend', markup);
        const item = {
            task:input
        };
        items.push(item);
        localStorage.setItem('items', JSON.stringify(items));
        this.reset();
    }

    addItems.addEventListener('submit', addItem);

[http://jsfiddle.net/r76xots2/9/]