Javascript按ID获取元素

Question

我的HTML包含代码：

<div id="msg"></div>

在它的身体里。

在头部我然后：

var msg = document.getElementByID("msg");

但是当我在一个函数中调用时：

msg.innerHTML = "test";

它返回一个错误，指出msg为空。我该怎么办？

Answer 1

首先，您必须考虑JavaScript是区分大小写的语言，因此您应该使用getElementById（注意最后一个字母的大小写）。接下来，如果按ID获取元素，则应将ID作为参数（而不是标记名称）传递：

var msg = document.getElementById("msg");

您可以在 MDN ：

中阅读有关此方法的更多信息

• https://developer.mozilla.org/en-US/docs/DOM/document.getElementById

另外，一个重要的注意事项是在标记完全加载时使用此代码，即当msg元素为“可见”时，JavaScript。为了实现这一目标，我们可以选择将<script>标记（包含相应的JavaScript代码）放在</body>之前的HTML末尾。

Answer 2

  

在头部我然后：

var msg = document.getElementByID("div");

那里有三个问题：

1. 如果该代码位于head中，但该元素在body中定义，则该代码运行时该元素尚不存在。

2. 元素的id为"msg"，而不是div。 div是其标记名称，并非唯一。

3. 这是getElementById，而不是getElementByID。

如果您将包含代码的脚本元素移到页面上的结束</body>标记之前，并使用document.getElementById("msg")，那么您应该没问题。

Answer 3

因为您在页面加载元素之前调用它。您需要等待document ready或window.onload引用该元素。