HTML DOM innerHTML 属性答案

【问题标题】：HTML DOM innerHTML PropertyHTML DOM innerHTML 属性
【发布时间】：2016-09-07 12:52:28
【问题描述】：

用id="demo"改变<p>元素的HTML内容：

document.getElementById("demo").innerHTML = "Paragraph changed!";

这是更改 html 内容的正确方法吗？

【问题讨论】：

你试过了吗？发生了什么？
它工作正常我只是想知道使用innerHTML的正确方法
@epascarello OP 想知道这是否是正确的方法，你可以用eval 做很多事情，但这并不意味着你应该这样做
好的，谢谢@pwoloaq
这样的方式是否正确。可能是，也可能不是。一切都取决于你在做什么。在您的简单测试用例中，这很好。如果您没有 HTML 标记，使用 textContent 可能更有意义。阅读MDN

标签： javascript html dom

【解决方案1】：

如果您只想更改内容，请使用

document.getElementById("demo").innerText = "Paragraph changed!";

或者你想改html标签也用，

document.getElementById("demo").innerHTML  = "<h2>Heading changed!</h2>";

另一种方法

document.getElementById("demo").firstChild.nodeValue = "Paragraph changed!";

【讨论】：

【解决方案2】：

作为MDN says:

此属性提供了一种完全替换元素内容的简单方法。

【讨论】：

【解决方案3】：

In this syntax example, {ID of element} is the ID of an HTML element and {content} is the new content to go into the element.
document.getElementById('{ID of element}').innerHTML = '{content}';

Now for your Issue,just do this
document.getElementsByTagName("P")[0].innerHTML = "Paragraph changed!"; [OR] document.getElementById("demo").innerHTML = "Paragraph changed!";

FiddleLink

【讨论】：