logo标签列表

为什么document.GetElementById返回null？

javascriptgetelementbyid
46

我一直成功地使用document.GetElementById()，但是最近我无法再次让它起作用。 请看以下代码:

    <html>
    <head>
     <title>no title</title> 
     <script type="text/javascript">
     document.getElementById("ThisWillBeNull").innerHTML = "Why is this null?";
     </script>
    </head>
    <body>
     <div id="ThisWillBeNull"></div>
    </body>
    </html>

我一直得到document.getElementById("parsedOutput") is null这个错误。 不论使用Firefox还是Chrome，不论启用哪些扩展程序，或者HTML中使用哪些头信息，它总是返回null，我找不到问题出在哪里。

在我的情况下，每次重新启动网页时都会创建一个新的“id”。 - CoolMind
6个回答
67
你可以像这样使用 script 标签： 

<script defer>
    // your JavaScript code goes here
</script>

当所有元素都加载完成后，JavaScript将应用于所有元素。

42

试试这个：

 <script type="text/javascript">
  window.onload = function() {
   document.getElementById("ThisWillBeNull").innerHTML = "Why is this null?";
  }
 </script>
12

如果没有 window.onload，您的脚本将永远不会被调用。Javascript 是一种基于事件的语言，因此如果没有明确的事件（如 onload、onclick、onmouseover），就不会运行脚本。

<script type="text/javascript">  
  window.onload = function(){  
   document.getElementById("ThisWillBeNull").innerHTML = "Why is this null?";  
  }
</script>

页面加载事件：

load 事件在文档加载过程的末尾触发。此时，文档中的所有对象都已经在 DOM 中，并且所有图像和子框架都已完成加载。

https://developer.mozilla.org/en/DOM/window.onload

1
“没有明确的事件[...]脚本不会运行”我不同意。如果脚本真的没有运行，那么**(1)为什么OP会收到“...为空”的警告？(2)**你必须以某种方式指定事件，比如<script event="...">...</script>，因为window.onload = ...也是脚本的一部分，因此不会运行。 ¶ 我认为这个答案更好地阐述了问题。 - Socowi
6
5

浏览器一找到脚本就会立即执行它。此时，文档的其余部分尚未加载——没有任何带有该ID的元素。如果您在文档的该部分加载后运行该代码，则可以正常工作。

-2
<script type="text/javascript">
  window.onload += function() {
   document.getElementById("ThisWillBeNull").innerHTML = "Why is this null?";
  }
 </script>

使用+=将更多的eventHandler分配给文档的onload事件。

2
这对我没有任何作用。 - Mixxiphoid
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接