Question

我要从克隆的div中删除图像。

我尝试过：

var divToPrint = document.getElementById(id);
var clonedDiv = jQuery.extend(true, {}, divToPrint)
var images = [].slice.call(clonedDiv.getElementsByTagName('img'), 0);
var l = images.length;
for (var i = 0; i < l; i++) {
    images[i].parentNode.removeChild(images[i]);
}

这行是错误的，我不知道如何获取克隆的div的所有图像：

var images = [].slice.call(clonedDiv.getElementsByTagName('img'), 0);

我收到此错误：

'getElementsByTagName' called on an object that does not implement interface Element.

Answer 1

这不是克隆元素的方式：

var clonedDiv = jQuery.extend(true, {}, divToPrint)

这是您使用DOM（cloneNode）克隆元素的方法：

var clonedDiv = divToPrint.cloneNode(true);

然后在克隆（带有DOM）中找到img元素：

var images = clonedDiv.getElementsByTagName("img");

要删除它们（使用DOM的removeChild）：

while (images.length) {
    images[0].parentNode.removeChild(images[0]);
}

由getElementsByTagName返回的NodeList处于活动状态，因此图像将从列表中消失，将新图像放置在索引0处，以便逐个删除图像，直到全部删除为止。如果您可能没有这样做的多填充getElementsByTagName（但这不太可能），请以相反的顺序循环：

for (var i = images.length - 1; i >= 0; --i) {
    images[i].parentNode.removeChild(images[i]);
}

或使用jQuery（clone，remove）来实现所有这些功能：

var clonedDiv = jQuery(divToPrint).clone();
clonedDiv.find("img").remove();

删除克隆的div的所有图像

1 个答案: