1. DOM是Javascript操作网页的接口

  2. 浏览器会根据DOM模型，将结构化文档解析成一系列节点，再由这些节点组成树状结构

    节点

  3. DOM的最小组成单位是节点（node)

  4. DOM树由各种不同类型的节点组成
  5. 节点的类型有七种：
    • Document:整个文档树的顶层节点
    • DocumentType:doctype标签(比如：<!DOCTYPE html>)
    • Element: 网页的各种HTML标签（比如<body>、<a>等）
    • Attr: 网页元素的属性（比如class="right"）
    • Text: 标签之间或标签包含的文本
    • Comment: 注释
    • DocumentFragment: 文档的片段

  6. 浏览器提供了原生的节点对象Node，以上七种节点都继承Node，因此具有一些共同的属性和方法

    节点树

  7. 一个文档的所有节点按照所在层级抽象为一个树状结构

  8. 浏览器提供原生的document节点，代表整个文档
  9. 文档的第一层有两个节点，第一个是文档类型节点<!doctype html>；第二个是<html>
  10. <html>构成了树状节点的根节点，其他html标签节点都是它的下级节点
  11. 除根节点外，其他节点都有三层关系：
  • 父节点关系：parentNode，直接的上级节点
  • 子节点关系：childNodes，直接的下级节点
  • 同级节点关系：sibling，拥有同一个父节点的节点