内容替换js脚本失败

时间:2016-01-31 20:12:22

标签: javascript replace

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

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

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

print(lst3[0][1])
print(lst3[1][3])
2
7

2 个答案:

答案 0 :(得分:1)

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

答案 1 :(得分:0)

至少有两种不同的方法可以解决你的问题:

&#13;
&#13;
function replaceHeading(){
        /*****  CORRECTED AND WORKING
		var newH2=document.createElement("h2");
		var newH2Text=document.createTextNode("Welcome");
		newH2.appendChild(newH2Text);
		var oldP=document.getElementById("para1");
		document.getElementById("id1").replaceChild(newH2,oldP);
        *////
        // OR a more simpler way
        document.getElementById("para1").innerHTML = "<h2>Welcome</h2>";
	}
window.onload=function() {
	document.getElementById("btn").onclick=replaceHeading;
}
&#13;
<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>
&#13;
&#13;
&#13;