跟随Udemy课程开发本地存储CRUD应用遇TypeError问题求助

错误原因 #

你在app.js中获取输入框元素时犯了语法错误：

const grocery = document.getElementById(".grocery");

document.getElementById()方法的参数是元素的纯ID名称，不需要添加类选择器的.前缀。你的输入框ID是grocery，但代码里传了".grocery"，导致方法返回null，后续访问grocery.value自然触发TypeError。

修复步骤 #

将获取输入框的代码修改为：

const grocery = document.getElementById("grocery");

如果你习惯用querySelector，也可以这样写（需用#表示ID选择器）：

const grocery = document.querySelector("#grocery");

额外提示 #

代码里还有一个拼写小错误：let edtiID = "";应该改为let editID = "";，虽然目前不影响功能，但后期开发编辑功能时可能引发问题，建议提前修正。

内容的提问来源于stack exchange，提问作者Ritwik Nandi