如何清理divs内容？

Question

I heared that simply to say document.getElementById('divId').innerHTML = ""; is not safe for future divId contents editing via JS so how to clean up divs contents safely?

Answer 1

What should always work is:

var div = document.getElementById('divId');
while(div.hasChildNodes()) {
    div.removeChild(div.firstChild);
}

innerHTML is not part of any specification but is widely supported by browsers.

Answer 2

I wrote something similar to Felix Kling, only diffirence is that I wanted to pass the id or the reference. So I wrote it like this:

function removeAllChildNodes(node) {
    i = (typeof(node) == "object") ? node : document.getElementById(node);

    while (i.hasChildNodes()) {
        i.removeChild(i.firstChild);
    }
}

Answer 3

Setting the innerHTML attribute to nothing will eliminate any DOM nodes withing the specified DIV. There is no risk of "safety".

You can do this safely :P

Answer 4

I believe this is where JS frameworks, such as jQuery, come to light... they are optimized for cross-browser security - which includes secure DOM element removal, although you will loose a bit of computing speed (setting innerHTML is always the fastest way)

as for others wondering about security of this, some browsers (notably MSIE) have flaws that would crash the browser or allow malicious procedures to be executed on client's side under certain conditions, so that's why setting innerHTML might not be as secure as people use to think ;-)