document.write () should delete all existing html after my page is loaded?

Viewed 954

I red this:

The write() method is mostly used for testing: If it is used after an HTML document is fully loaded, it will delete all existing HTML.

So I decided to test this, I wrote this code:

<!doctype html> 
<html>
<head>
 <meta charset="utf-8">
</head>
    <body>
    <p>I'm TEST which should be a deleted?</p>
        <script>
            var drink = "Red bull";
            var lyrics = "";
            var cans = 99;

            while(cans > 0)
            {
                lyrics += cans + " cans of " + drink + " on the wall <br>";   
                cans--;  
            }
            document.write(lyrics);
        </script>
    </body>
</html>

As you can see I added <p>I'm TEST which should be a deleted?</p> after that I invoked document.write between my script tag which should delete all existing html including this paragraph?

But output is next:

enter image description here

But paragraph is still there, shouldn't it be removed by following this sentence:

If it is used after an HTML document is fully loaded, it will delete all existing HTML.

4 Answers

Test it with this code. You will get to know what document.write() actually do. Upon clicking the button the HTML will get hide and you will only see the 11(document.write(5+6)) answer. This is what "The write() method is mostly used for testing: If it is used after an HTML document is fully loaded, it will delete all existing HTML." means.

<!DOCTYPE html>
<html>
<body>

<h2>My First Web Page</h2>
<p>My first paragraph.</p>

<button type="button" onclick="document.write(5 + 6)">Try it</button>

</body>
</html> 

Related