CODEWITHSUNDEEP
javascripthtmldom
Cristina Fierbinteanu
Cristina Fierbinteanu

Reputation: 53

unexpected behaviour when replacing innerHTML using document.getElementById

What am I doing wrong in the following? I would like to replace only the content of a div, but the content of the whole page is changed.

Why is the link "Next" disappearing when "Second page" is displayed?

<div id = "notes">
 <p>First page</p>
</div>

<a href="javascript:document.getElementById('notes').innerHTML = '<h1>Second page</h1>'">Next</a>

Upvotes: 0

Views: 48

Answers (1)

SLaks
SLaks

Reputation: 888205

Navigating to a javascript: URI will display the result of the script.

The assignment operator evaluates to the value assigned, so you end up navigating to that chunk of HTML directly.

To prevent this, wrap your expression in the void() operator so that it will have no value.

Upvotes: 2

Related Questions