localStorage在JavaScript中不起作用

我正试图用纯JavaScript（没有额外的框架或库）创建一个单页应用程序。问题是我添加到TODO列表中的值没有存储在localStorage中（并且没有显示）

我将非常感谢您对这项任务的任何帮助

如何简化代码？（不使用任何其他库和框架（如jquery等）

这是我的密码：

让inputTask=document.getElementById（'toDoEl'）；
让editTask=document.getElementById（'editTask'）；
让checkTask=document.getElementById（'list'）；
让emptyList=document.getElementById（'emptyList'）；
设项目=[]；
设id=[]；
设labelToEdit=null；
常数为空=0；
让页面=['index'，'add'，'modify']；
加载（）；
函数加载（）{
items=loadFromLocalStorage（）；
id=getNextId（）；
items.forEach（item=>renderItem（item））；
}
功能显示（如图所示）{
location.href='#'+显示；
pages.forEach（函数（第页）{
document.getElementById（page.style.display='none'；
});
document.getElementById（已显示）.style.display='block'；
返回false；
}
函数getNextId（）{
for（设i=0；i id）{
id=item.id；
}
}
id++；
返回id；
}
函数loadFromLocalStorage（）{
让localStorageItems=localStorage.getItem（'items'）；
if（localStorageItems==null）{
返回[]；
}
返回JSON.parse（localStorageItems）；
}
函数saveToLocalStorage（）{
setItem（'items'，JSON.stringify（items））；
}
功能设置选中（复选框，isDone）{
中频（isDone）{
checkbox.classList.add（'checked'）；
checkbox.src=https://image.ibb.co/b1WeN9/done_s.png';
让newPosition=checkTask.childElementCount-1；
让listItem=checkbox.parentNode；
listItem.classList.add（'checked'）；
checkTask.removeChild（列表项）；
checkTask.appendChild（listItem）；
}否则{
checkbox.classList.remove（'checked'）；
checkbox.src=https://image.ibb.co/nqRqUp/todo_s.png';
让listItem=checkbox.parentNode；
listItem.classList.remove（'checked'）；
}
}
函数renderItem（项）{
让listItem=document.getElementById（'item_template'）.cloneNode（true）；
listItem.style.display='block'；
setAttribute（'data-id'，item.id）；
让label=listItem.querySelector（'label'）；
label.innerText=item.description；
让checkbox=listItem.querySelector（'input'）；
checkTask.appendChild（listItem）；
setChecked（复选框，item.isDone）；
emptyList.style.display='none'；
返回列表项；
}
函数createNewElement（任务，isDone）{
let item={isDone，id:id++，description:task}；
项目。推送（项目）；
saveToLocalStorage（）；
renderItem（项目）；
}
函数addTask（）{
if（输入ask.value）{
createNewElement（inputAsk.value，false）；
inputAsk.value=''；
显示（‘索引’）；
}
}
函数modifyTask（）{
if（editTask.value）{
let item=findItem（labelToEdit）；
item.description=editTask.value；
labelToEdit.innerText=editTask.value；
saveToLocalStorage（）；
显示（‘索引’）；
}
}
函数findItem（子函数）{
让listItem=child.parentNode；
让id=listItem.getAttribute（'data-id'）；
id=parseInt（id）；
让item=items.find（item=>item.id==id）；
退货项目；
}
//Chanhe img to已检查
功能修改项（标签）{
labelToEdit=标签；
editTask.value=label.innerText；
显示（‘修改’）；
editTask.focus（）；
editTask.select（）；
}
功能检查项（复选框）{
let item=findItem（复选框）；
如果（项===null）{
返回；
}
item.isDone=！item.isDone；
saveToLocalStorage（）；
setChecked（复选框，item.isDone）；
}
函数删除项（输入）{
让listItem=input.parentNode；
让id=listItem.getAttribute（'data-id'）；
id=parseInt（id）；
用于（让我输入项目）{
如果（项[i].id==id）{
项目.拼接（i，1）；
打破
}
}
如果（items.length==空）{
emptyList.style.display='block'；
}
saveToLocalStorage（）；
listItem.parentNode.removeChild（listItem）；
}

*{
框大小：边框框；
}
身体{
字体系列：无衬线；
}
h2，li，#通知{
文本对齐：居中；
}
氢{
字体大小：正常；
保证金：0自动；
填充顶部：20px；
垫底：20px；
}
#根{
宽度：400px；
高度：550px；
保证金：0自动；
位置：相对位置；
}
#根>ul{
显示：块；
}
#添加按钮{
显示：块；
保证金：0自动；
}
.checkbox，.delete{
高度：24px；
底部：0；
}
.复选框{
浮动：左；
}
.删除{
浮动：对；
}
保险商实验室{
利润率：20px 30px 0 30px；
填充顶部：20px；
左侧填充：20px；
文本对齐：居中；
}
#待办事项{
宽度：50%；
}
李{
宽度：100%；
列表样式：无；
框大小：边框框；
显示器：flex；
证明内容：之间的空间；
对齐项目：居中；
利润率：15px自动；
}
标签{
保证金：0自动；
文本对齐：对齐；
文本对齐：词间对齐；
}
标签：悬停{
光标：自动；
}
李{
背景颜色：灰色；
}
span.按钮{
光标：指针；
}
#添加、#修改{
显示：无；
}

作业12-简单待办事项列表
简单TODO应用程序
添加新任务
TODO是空的





添加任务
取消
保存更改
修改项目
取消
保存更改

我在Codepen中检查了您的代码，代码正常

---

我在Codepen中检查了您的代码，代码正常

---

您的代码看起来确实有效。如果在

loadFromLocalStorage

函数的第49行正上方

console.log（JSON.parse（localStorageItems））

，它将在控制台中按预期显示。此外，在刷新时，这些项将保持不变

如果您的意思是，您正在检查localStorage，但没有看到项目，那么可能是您正在查看预览版本