Javascript: `document` 的属性是否包含 `body` 之外的节点？

Question

我正在阅读Mozilla's Introduction to DOM ，并发现他们的一个示例很有趣 - 其中 body 作为 document 的属性出现。这对我来说很不典型，因为我只看到过使用 get 访问节点的示例。

我尝试了三种不同的方式来访问 document 的 body 元素，

document.body.appendChild(_someNode_)
document['body'].appendChild(_someNode_)
document.getElementsByTagName('body')[0].appendChild(_someNode_)

发现 Mozilla 中显示的示例是一个很好的速记(第一行)。

此时，我觉得我可以简单地用这个简写来链接节点，但发现除了body之外，它对于任何东西都是未定义的。

这是一个例子:

console.log(document.body); // #document
console.log(document.body.p); // undefined
console.log(document.body.getElementsByTagName('p')[0]); // <p></p>

这是怎么回事？

Answer 1

有一些标签在 document 中获取自己的属性，但它们很少见，并且在某些情况下依赖于浏览器。例如，document.forms 包含所有表单标记的集合，document.frames 包含页面所包含的所有框架和 iframe 的集合。

但是您应该避免使用这些属性，而使用 .getElementById()、.getElementsByTagName() 以及更新且更通用的 .querySelector() 和 .querySelectorAll()