类型错误：document.body 为空答案

【问题标题】：TypeError: document.body is null类型错误：document.body 为空
【发布时间】：2015-03-06 03:41:45
【问题描述】：

为什么我在浏览器中出现错误？

TypeError: document.body 为空

代码在JSfiddle 中运行良好。

HTML

<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="jsscript.js"></script>
</head>
<body>
</body>

var creElem = document.createElement("p");
creElem.innerHTML = "Hellow World";
creElem.setAttribute("id", "id_name");
document.body.appendChild(creElem);

【问题讨论】：

JSFiddle 在页面加载后运行你的脚本。（左侧面板中的“onLoad”）
@MichaelPerlakowski 是否可以通过{} 观察MutationObserver 的变化？？

标签： javascript typeerror

【解决方案1】：

在 DOM 加载时执行代码。将您的逻辑封装在 DOMContentLoaded 的事件侦听器中。

document.addEventListener('DOMContentLoaded', function () {
    // ...
});

它在 JSFiddle 中工作的原因是因为 JS 在加载时执行（这是 JSFiddle 中的默认选项）。

或者，根据您需要执行逻辑的时间，您还可以使用：

window.addEventListener('load', function () {
    // ...
});

见：Difference between DOMContentLoaded and Load events

【讨论】：

是否可以通过MutationObserver 观察{} 的变化？？

【解决方案2】：

您的document.body 尚未创建或尚不存在。如果您想将 child 附加到 document.body 或在您的 javascript 中对 document.body 执行任何操作，请将您的 javascript 代码或 js 文件的链接放在 body 标记的末尾。

<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
    </head>
    <body>
        <script src="jsscript.js"></script>
    </body>
</html>

【讨论】：