使用document.getElementById替换innerHTML时出现意外行为

Question

以下我做错了什么？我想只替换div的内容，但整个页面的内容都会改变。

为什么显示“第二页”时链接“下一步”消失？

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

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

Answer 1

导航到javascript: URI将显示脚本的结果。

赋值运算符求值为指定的值，因此您最终会直接导航到该HTML块。

为了防止这种情况，请将表达式包装在void()运算符中，以使其没有值。