Question

为什么div中的文字没有改变？我在这里做错了什么？

这是HTML：

<!DOCTYPE html>
<html>
<head>
    <script src="script.js"></script>
</head>
<body>
    <div id="demo">Text to be changed.</div>
</body>
</html>

和Javascript：

document.getElementById("demo").innerHTML = "Hello World";

提前谢谢。

Answer 1

您需要将标签放在底部。或者在div之后。当你现在加载脚本时，DOM还没有准备好。因此，如果在DOM初始化之后运行脚本，那么你会没事的。所以把

 <script src="script.js"></script>

在</body>

之前

Answer 2

您的脚本在文档加载完毕之前运行，因此您可能需要等待onload。使用jQuery，您可以执行此操作：

$(function() {
  document.getElementById("demo").innerHTML = "Hello World";
});

或者更简洁：

$(function() {
  $("#demo").html("Hello World");
});

Answer 3

您需要使用侦听器来包装JavaScript，以准备好DOM：

document.addEventListener('DOMContentLoaded', function () {
    document.getElementById("demo").innerHTML = "Hello World";
});

目前发射太早了。

https://developer.mozilla.org/en/docs/Web/Events/DOMContentLoaded

Answer 4

这是有效的

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
$(document).ready(function() {
    document.getElementById('demo').innerHTML = 'Hello World';
    });
</script>
</head>
<body>
    <div id="demo">Text to be changed.</div>
</body>
</html>

innerHTML无法设置

4 个答案: