div元素上的InnerHTML正在创建一个新的<p>元素

Question

我正在尝试修改div元素的文本。它甚至不会更改现有文本，只是在屏幕顶部添加一个段落元素。

代码：

＆＃13;

＆＃13;

function addContent() {
  document.getElementById("test").innerHTML = "Something";
}

＆＃13;

<div id="test">This is some text</div>
<button class="btn btn-primary btn-lg" id="getStartedButton" onclick="addContent()">Get Started</button>

＆＃13;

＆＃13;

＆＃13;

但不是在测试中div编辑文本。它会在页面顶部使用p

创建一个新的id="test"元素

这与bootstraps有关吗？

提前致谢！

更新：下面的艾米帮助解决了这个问题，谢谢！

Answer 1

确保您的JavaScript代码在相关的HTML元素之后。这是因为代码可以在DOM完成呈现文档之前运行。如果是这种情况，您的代码实际上不会找到该元素。

只要在呈现DOM之后执行该代码，您就可以在文档顶部放置JS代码而不会出现问题。因此，在文档顶部和底部的JS方法中，您可以调用该函数。这可以。建议在文档的onload事件中调用这些函数。

一般来说，将JS放在body标签的末尾是一个好主意。这并非总是可行，但它是一个很好的习惯。