Question

JavaScript 错误：未捕获的类型错误：无法读取未定义的属性“remove”

2016-06-26

79193

javascript dom

我有一个脚本可以在添加成功后删除已上传的文件，但是在网站加载时出现此错误。

"Uncaught TypeError: Cannot read property 'remove' of undefined"

缺少了什么？

<script>
onload=function() {
    document.querySelectorAll("li[id^='uploadNameSpan']")[0].remove();
}
</script>

Answer 1

基本上，您的问题是，当您调用此代码时，DOM 中没有任何与查询 “li[id^='uploadNameSpan']” 相对应的元素。因此 querySelectorAll 返回一个空的 NodeList ，其在 0 位置（或任何位置）具有 undefined 。

发生的情况的细分：

var liElements = document.querySelectorAll("li[id^='uploadNameSpan']"); // this returns an empty NodeList

var nonExistentFirstElement = liElements[0]; // this is undefined, there's nothing at the first position

nonExistentFirstElement.remove(); // thus, this is an error since you're calling `undefined.remove()`

根据您的使用情况，您可以做的一件事是在尝试删除之前检查返回的项目数量：

var liElements = document.querySelectorAll("li[id^='uploadNameSpan']");
if (liElements.length > 0) {
  liElements[0].remove();
}

通常，您必须确保在尝试删除元素时该元素位于 DOM 中。