为什么JavaScript中用document.body调用createElement方法不生效？

• createElement是document对象的专属方法，不属于任意DOM元素的原型链，因此document.body作为<body>元素的实例，本身就没有这个方法，调用自然会报错失效。
• 你调用document.body.style可以正常生效，是因为style是所有HTMLElement类型实例的通用属性，任何DOM元素都自带这个属性用于操作行内样式，两者的接口归属完全不同。

设计逻辑补充 #

DOM规范这么设计是因为创建元素属于文档级操作：所有元素都归属于当前整个HTML文档实例，用document.createElement生成的元素初始状态是游离在DOM树之外的，你可以根据需求把它插入到页面的任意节点下，比如body、自定义容器甚至head里，示例如下：

// 正确创建元素的流程
const h1 = document.createElement('h1')
h1.innerText = '测试标题'
// 手动插入到body的DOM树中
document.body.appendChild(h1)

如果需要直接在某个元素下生成子内容，可以用元素实例自带的方法，比如appendChild()、insertAdjacentHTML()、replaceChildren()等。

内容的提问来源于stack exchange，提问作者Lusks