Remove all content using pure JS

javascript html innerhtml
Félix Saparelli picture Félix Saparelli · Nov 22, 2010 · Viewed 54.7k times · Source

I'm looking for a way to remove the entire content of a web page using pure Javascript -- no libraries.

I tried:

document.documentElement.innerHTML = "whatever";

but that doesn't work: it replaces the inside of the <html/> element. I'm looking at replacing the entire document, including if possible the doctype and <?xml declaration.

Answer

alex picture alex · Nov 22, 2010

I think a browser rightfully assumes a page with content-type text/html will always be a web page - so whilst you may do something like...

document.body.innerHTML = '';

It will still have some HTML hanging around.

You could try...

document.documentElement.innerHTML = '';

...which left me with <html></html>.

Yi Jiang did suggest something clever.

window.location = 'about:blank';

This will take you to a blank page - an internal mechanism provided by most browsers I believe.

I think however the best solution is to use document.open() which will clear the screen.

Related questions

Show/hide 'div' using JavaScript

For a website I'm doing, I want to load one div, and hide another, then have two buttons that will toggle views between the div using JavaScript. This is my current code The second function that replaces div2 is not …

Read More
Change label text using JavaScript

Why doesn't the following work for me? <script> document.getElementById('lbltipAddedComment').innerHTML = 'Your tip has been submitted!'; </script> <label id="lbltipAddedComment"></label>

Read More
Javascript - Append HTML to container element without innerHTML

I need a way to append HTML to a container element without using innerHTML. The reason why I do not want to use innerHTML is because when it is use like this: element.innerHTML += htmldata It works by replacing all …

Read More