JavaScript in HTML head， innerhtml 不起作用

javascript in html head, innerhtml not working?

本文关键字：innerhtml 不起作用 head in HTML JavaScript      更新时间：2023-09-26
 <html>
 <head>
 <script type="text/javascript">
 document.getElementById("eee").innerHTML = "7777";
 </script>

 </head>
 <body>
 <p id="eee">aa</p>
 </body>
 </html>

为什么 innerHTML 在头部不起作用，但它确实在身体中起作用？请原谅初学者的问题，但一年前我上次使用javascript时，这根本不是问题。

您需要等待 HTML 文档加载完毕，然后才能对其进行操作。

<script type="text/javascript">
  window.onload = function() {
    document.getElementById("eee").innerHTML = "7777";
  };
</script>

请记住，脚本是按照它们在 HTML 文档中列出的顺序进行评估的，因此您的脚本会在浏览器处理"head"部分时运行。 由于浏览器尚未解析"body"部分，因此它不知道任何ID为"eee"的元素。

但是，通过将函数分配给"window.onload"事件，可以延迟内部 HTML 赋值的执行，直到窗口完全加载所有资源并安全地操作文档。

请注意，如果您的脚本位于 body 部分，则在列出 id 为"eee"的元素后，脚本将无需等待窗口"加载"事件即可工作。

您需要确保文档已加载。

检查此问题的答案。

javascript 在 dom 准备好之前就正在运行。 使用事件DOMContentLoaded为了在标头中执行此操作。对于较旧的浏览器，应使用 onload 事件。

http://jsfiddle.net/r7VYz/1/

 <html>
 <head>
 <script type="text/javascript">
 document.addEventListener('DOMContentLoaded', function () {
    document.getElementById("eee").innerHTML = "7777"; 
 }, false);
 </script>

 </head>
 <body>
 <p id="eee">aa</p>
 </body>
 </html>​

这是因为您的脚本找不到该元素。当 DOM 已正确加载或仍在加载时，头中的脚本首先加载。

<p id="eee">aa</p>
<!-- Use the script after the element, so that the script can find it -->
<script type="text/javascript">
 document.getElementById("eee").innerHTML = "7777";
</script>

其他方法可能在窗口的 onload 事件上执行脚本

window.onload = function() {
    document.getElementById("eee").innerHTML = "7777";
};

你想要更多这样的东西。您必须等待整个文档加载，然后才能保证对其进行修改。像下面一样

 <html>
<head>
 <script type="text/javascript">
    window.onload = function() {document.getElementById("eee").innerHTML = "7777";};
 </script>
 </head>
 <body>
 <p id="eee">aa</p>
 </body>
 </html>

这是工作 jsfiddle

相关文章：