How do I “refresh” element in DOM?

Question

I've got an empty DIV element in which I append images by using function createElement("img") and append them with appendChild. So now I've got DIV element full of images.

I would like to use one button to clean this DIV and add new images in it simultaneously. Thanks for your help

Answer 1

Are you just looking for method replaceChild? Or you could remove all child elements before adding new images: replaceChild? Or you could remove all child elements before adding new images:

// assuming yor div is in variable divelement
while (divelement.firstChild)
  divelement.removeChild(divelement.firstChild);

Answer 2

what do you mean by clean? If you just want to empty it, you can do

document.getElementById('mydiv').innerHTML = '';

And then add on whatever new images you want.

Answer 3

虽然在循环中设置innerHTML和调用removeChild（）都会清除DIV中的内容，但由于当今浏览器的性质，innerHTML方法会更快。