javascript - 完全删除innerHTML img元素

Question

typebox.innerHTML += "<div class='typebox'><img id='typeImg' width='30px' height='30px' src="+d[o].src+"></div>";

我正在使用 innerHTML 添加多个图像，我需要通过单击删除按钮来删除这些图像，但我不知道如何执行此操作。

我已经尝试过:

var typebox = document.getElementById("typebox");
typebox.style.display = 'none';

使用 display:none; 使这些图像根本不显示。

var typebox = document.getElementById("typebox");
typebox.innerHTML = "";

看起来它不会删除这些图像，更像什么都不做。

那么我应该如何彻底删除这些图像？

Answer 1

试试这个:

removeChild will help in this case

var typebox = document.getElementById('typebox');
typebox.innerHTML += "<div class='typebox'><img id='typeImg' width='300px' height='300px' src='https://www.google.co.in/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'></div>";
document.getElementById('removeBtn').addEventListener('click', function () {
    var toRemove = document.getElementById('typeImg');
    toRemove.parentNode.removeChild(toRemove);
});

<div id='typebox'></div>
<button id='removeBtn'>remove</button>

I hope this helps..