Does document.body.innerHTML = "" clear the web page?

Tony_Henrich picture Tony_Henrich · Feb 12, 2010 · Viewed 109.7k times · Source

When I refresh the page below in FF 3.0, I expected the web page to clear but it didn't.

Why doesn't document.body.innerHTML = "" clear the page?

UPDATE: I am trying to clear the previous screen during a refresh while the new page is loading. I actually want to see the page clear, wait and then the next js running. I don't want to clear the screen after the page has loaded.

...
<body>
    <script type="text/javascript">
        document.body.innerHTML = "";
        for (var i = 0; i < 1000000000; i++) {
        }
    </script>

    <img src="images/web.gif" /><br />

    <script type="text/javascript">
        document.write( "hello<br />");
    </script>

    <img src="images/warning.png" /><br />

</body>

Answer

Douwe Maan picture Douwe Maan · Feb 12, 2010

document.body.innerHTML = ''; does clear the body, yeah. But it clears the innerHTML as it is at the moment the code is ran. As you run the code before the images and the script are actually in the body, it tries to clear the body, but there's nothing to clear.

If you want to clear the body, you have to run the code after the body has been filled with content. You can do this by either placing the <script> block as the last child of body, so everything is loaded before the code is ran, or you have to use some way to listen to the dom:loaded event.