• 概念：Document Object Model，文档对象模型。将标记语言文档的各个组成部分，封装为对象。可以使用这些对象，对标记语言文档进行 CRUD 的动态操作

• DOM 树：

  

• W3C DOM 标准被分为 3 个不同的部分：

  • 核心 DOM - 针对任何结构化文档的标准模型
    • Document：文档对象
    • Element：元素对象
    • Attribute：属性对象
    • Text：文本对象
    • Comment：注释对象
    • Node：节点对象，其他5个的父对象
  • XML DOM - 针对 XML 文档的标准模型
  • HTML DOM - 针对 HTML 文档的标准模型

核心 DOM 模型

Document 文档对象

• 创建
  • window.document
  • document
• 方法
  • 获取 Element 对象
    • getElementById()：根据 id 属性值获取元素对象。id 属性值一般唯一
    • getElementsByTagName()：根据元素名称获取元素对象们。返回值是一个数组
    • getElementsByClassName()：根据 Class 属性值获取元素对象们。返回值是一个数组
    • getElementsByName()：根据 name 属性值获取元素对象们。返回值是一个数组
  • 创建其他 DOM 对象
    • createAttribute(name)
    • createComment()
    • createElement()
    • createTextNode()
• 属性
• 代码

Element 元素对象

• 获取/创建
  • 通过 document 来获取和创建
• 方法
  • removeAttribute()：删除属性
  • setAttribute()：设置属性
• 代码

Node 节点对象

• 特点
  • 所有的 DOM 对象都可以被认为是一个节点
• 方法
  • appendChild()：向节点的子节点列表的结尾添加新的子节点。
  • removeChild()：删除（并返回）当前节点的指定子节点。
  • replaceChild()：用新节点替换一个子节点。
• 属性
  • parentNode：返回节点的父节点
• 代码

案例：动态表格

• 代码