无法尝试清除以前使用Javascript创建的图像

Question

点击按钮，我将图像添加到标题为“floatingButton1”的div中。稍后，我想运行一个单独的函数并删除我添加的图像，以便可以看到背景图像。

这是我添加图片的代码。

var floatingButton1 = document.getElementById('floatingButton1');
    var i1 = document.createElement("img");
    i1.src = "Images/tnR1.png";
    i1.type = "image";
    floatingButton1.appendChild(i1);

我试图像这样删除它，但它不起作用：

var floatingButton1 = document.getElementById('floatingButton1');
var i1 = document.createElement("img");
i1.src = "Images/whitesquare.png";
i1.type = "image";
floatingButton1.removeChild(i1);

如何从DIV中删除图像/清除我制作的所有图像。

Answer 1

运行时

var i1 = document.createElement("img");

第二次，它会创建一个新的img标记。要删除它，只需

floatingButton1.removeChild(i1);

在第二个代码块中输出任何的其他代码。这些都不是必需的，当您重新定义i1时，您完全失去了参考。

Answer 2

var floatingButton1 = document.getElementById('floatingButton1');
var i1 = document.createElement("img");
i1.src = "Images/whitesquare.png";
i1.type = "image";

第二次不需要上述代码。 var i1已保留对附加image的引用。

只需使用

floatingButton1.removeChild(i1);