为什么表单元素中的Javascript会失败？

我最近在对一个JS应用程序进行故障排除时撞到了墙上；它可以归结为这样的事情：将js放在表单html元素中会导致它失败/立即反转。为什么会这样

失败：

<div id="p1">Hello World!</div>
<form>
<button onclick='document.getElementById("p1").innerHTML="New text!";'>Change me</button
</form>

你好，世界！
改变我试试看

你好，世界！
改变我

您正在发布表单，因此页面正在重新加载，您需要添加
return false
元素默认设置为
type=“submit”
，这确实是个坏主意。。。只是我的2cents@devnull69表单中按钮的默认行为是
submit
…Yes。。。我就是这么说的（至少我是这个意思）。将“提交”作为元素的默认行为是一个非常糟糕的主意。如果您希望
按钮
不提交表单，则向其添加
type=“button”
。
<div id="p1">Hello World!</div>
<button onclick='document.getElementById("p1").innerHTML="New text!";'>Change me</button

<div id="p1">Hello World!</div>
<form method="post" onsubmit="return false;">
<button onclick='document.getElementById("p1").innerHTML="New text!";'>Change me</button>
</form>