javascript - Why doesn't innerHTML replacing run?

Question

<!DOCTYPE HTML>
<html>
<head>
<script>
document.write("TEST1")
document.getElementById("demo").innerHTML="TEST2"
document.write("TEST3")
</script>
</head>

<body>
<p id="demo">TO_BE_REPLACED</p>
</body>
</html>

Here is the output: TEST1

TO_BE_REPLACED

It seems the javascript executing stopped at document.getElementById("demo").innerHTML="TEST2". Why doesn't it execute?

See this : stackoverflow.com/questions/5704924/… , stackoverflow.com/questions/8864776/getelementbyid-and-null-why , stackoverflow.com/questions/5371047/… or stackoverflow.com/questions/10839271/… — HoLyVieR
– HoLyVieR, Commented Feb 19, 2013 at 2:45

Niet the Dark Absol · Accepted Answer · 2013-02-19 02:47:29Z

3

When the script is being run, <p id="demo"> does not exist yet. Therefore, document.getElementById('demo') is returning null, which then triggers an error when you try to assign null.innerHTML = "TEST2"

This error stops all execution, so you never get to see the final TEST3.

answered Feb 19, 2013 at 2:47

Niet the Dark Absol

326k86 gold badges480 silver badges604 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

peter.aryanto · Accepted Answer · 2013-02-19 02:58:13Z

1

You need to enclose your script in a function that will be called when the window loads (using "window.onload" event).

<!DOCTYPE HTML>
<html>
<head>
<script>
    function replaceDemoText()
    {
        document.getElementById("demo").innerHTML="TEST2";
    }
    window.onload = replaceDemoText;
</script>
</head>

<body>
<p id="demo">TO_BE_REPLACED</p>
</body>
</html>

answered Feb 19, 2013 at 2:58

peter.aryanto

5223 silver badges6 bronze badges

Collectives™ on Stack Overflow

javascript - Why doesn't innerHTML replacing run?

2 Answers 2

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related