javascript - 内容替换js脚本失败

下面的代码似乎无法正常运行。 newH2Text应该替换para1。这不会发生。我使用了Sublime，然后浏览了浏览器控制台，甚至浏览了SO的代码段。我几乎可以肯定我有逐字记录的代码。

具有自己的id属性的第一段应替换为在我的JS脚本中创建的newH2Text。我在这里找不到我的错误。请帮忙。

PS刷新按钮正常工作。那里没有问题。

function replaceHeading(){
		var newH2=document.createElement("h2");
		var newH2Text=document.createTextNode("Welcome");
		newH2.appendChild(newH2Text);
		var myDiv=document.getElementById("id1");
		var oldP=document.getElementById("para1");
		myDiv.replaceChild(NewH2,oldP);
	}
window.onload=function() {
	document.getElementById("btn").onclick=replaceHeading;
}

<div id="id1">
<p id="para1">Welcome to my web page.</p>
<p id="para2">Take a look around.</p>
<input type="button" id="btn" value="Replace Element">
<br>
<input type="button" value="refresh" onclick="location.reload()">
</div>

最佳答案

NewH2大写，但应为newH2小写。

myDiv.replaceChild(newH2,oldP);

请参阅此fiddle作为示例

更新资料

要更早地捕获这些错误，您可以使用“严格模式”。例如：

;(function(){
   "use strict";
   function replaceHeading(){
          var newH2=document.createElement("h2");
          var newH2Text=document.createTextNode("Welcome");
          newH2.appendChild(newH2Text);
          var myDiv=document.getElementById("id1");
          var oldP=document.getElementById("para1");
          myDiv.replaceChild(NewH2,oldP);
     }
}());

这将给您错误Uncaught ReferenceError: NewH2 is not defined。