JavaScript 一些 DOM 的知识点

本来准备把 DOM 的接口都总结一遍,但是我太天真了,DOM 下面的接口太庞大了,总结起来太费时了,所以只将自己平时没注意到的以及常用到的知识记下来了,更详细的 DOM 还是看 MDN 上的资料吧!

Node 接口

  • Node 是一个接口,该接口由 DOM 中的所有的节点类型实现,即所有节点类型(比如最常见的 Element 类型)都继承自 Node 接口。

  • 本来,节点类型总共有12种,但是随着 DOM4 的出现,有 5 种节点类型被弃用。( 详情看这里 )

  • Node 接口的很多属性(比如 childNodes 、lastChild、firstChild、nextSibling、previousSibling)针对的是所有的节点类型,并不只是元素节点。

document.body.childNodes;

在浏览器控制端输入上面的代码,你会看到显示的结果不仅仅有元素节点,还可能有文本节点、注释节点等!

  • Node.hasChildNodes(): 检测一个节点下面是否包含一个或多个节点,若是,则返回 true。
  • Node.contains(otherNode): 判断传入的节点是否是调用该方法的节点的后代节点。

Document 类型 (文档节点)

  • JavaScript 通过 Document 类型表示文档。document 对象是 window 对象的一个属性。

  • 一些 document 对象的属性:

document.documentElement// 指向 html 元素document.head// 指向 head 元素(HTML 5 新增)