Javascript 使用DOM方法删除图像元素

有人能解释一下为什么remove方法不能像我预期的那样工作吗。我想从文档中删除所有img元素。 循环浏览文档并删除所有图像，这就是我想要的，但这只删除2个图像，为什么？ 这是密码

HTML

JS

---

关于该代码，有两件事让我担心：

remove是一种相对较新的DOM方法，但它的支持度不高。要获得更好的支持，请使用img.parentNode.removeChildimg

getElementsByTagName返回一个活动节点列表，因此当您从列表开头移除元素时，所有其他元素都会向上移动。因此，如果列表有5个条目，您删除了i=0元素，所有其他元素都会移动，现在有一个新的i=0元素，长度为4。您的循环将移动到i=1，因此i=0处的元素（以前在i=1处）将不会得到处理

对于非活动节点列表，请使用querySelectorAll'tagname'或仅向后循环列表，从末尾删除。或者使用Array.prototype.slice将节点列表转换为数组

所有现代浏览器以及IE8都支持querySelectorAll

下面是一个使用querySelectorAll的示例：

或者使用Array.prototype.slice：

---

关于该代码，有两件事让我担心：

remove是一种相对较新的DOM方法，但它的支持度不高。要获得更好的支持，请使用img.parentNode.removeChildimg

getElementsByTagName返回一个活动节点列表，因此当您从列表开头移除元素时，所有其他元素都会向上移动。因此，如果列表有5个条目，您删除了i=0元素，所有其他元素都会移动，现在有一个新的i=0元素，长度为4。您的循环将移动到i=1，因此i=0处的元素（以前在i=1处）将不会得到处理

对于非活动节点列表，请使用querySelectorAll'tagname'或仅向后循环列表，从末尾删除。或者使用Array.prototype.slice将节点列表转换为数组

所有现代浏览器以及IE8都支持querySelectorAll

下面是一个使用querySelectorAll的示例：

或者使用Array.prototype.slice：

---

@史蒂芬豪斯坦：的确如此我想我应该把它放在原稿中，但无论如何，它现在已经在版本中有了示例。@T.J.Crowder现在一切都清楚了，我完全忘记了getElementsByTagName返回的是实时html集合，谢谢兄弟。@StefanHaustein:的确如此。：-我想我应该把它放在原稿中，但无论如何，它现在在有示例的版本中。@T.J.Crowder现在一切都清楚了，我完全忘记了getElementsByTagName返回live html集合，谢谢兄弟。

<img src="http://www.lorempixel.com/50/50" alt="pic">
<img src="http://www.lorempixel.com/50/50/animals" alt="pic">
<img src="http://www.lorempixel.com/50/50/city" alt="pic">

var imgElements = document.getElementsByTagName("img"); // HTMLCollection

for(var i=0; i<imgElements.length; i++) {
  var img = imgElements[i];
  img.remove();
}

var imgElements = document.querySelectorAll("img"); // HTMLCollection
for(var i=0; i<imgElements.length; i++) {
  var img = imgElements[i];
  img.parentNode.removeChild(img);
}

var imgElements = document.getElementsByTagName("img"); // HTMLCollection
for(var i=imgElements.length-1; i>=0; i--) {
  var img = imgElements[i];
  img.parentNode.removeChild(img);
}

var imgElements = Array.prototype.slice.call(document.getElementsByTagName("img"));
for(var i=0; i<imgElements.length; i++) {
  var img = imgElements[i];
  img.parentNode.removeChild(img);
}