❑ 理解文档对象模型（DOM）的构成
    ❑ 节点类型
    ❑ 浏览器兼容性
    ❑ MutationObserver接口
    文档对象模型（DOM, Document Object Model）是HTML和XML文档的编程接口。
    DOM表示由多层节点构成的文档，通过它开发者可以添加、删除和修改页面的各个部分。
    脱胎于网景和微软早期的动态HTML（DHTML,Dynamic HTML）, DOM现在是真正跨平台、语言无关的表示和操作网页的方式。
    DOM Level 1在1998年成为W3C推荐标准，提供了基本文档结构和查询的接口。
    本章介绍DOM，主要因为它与浏览器中的HTML网页相关，并且在JavaScript中提供了DOM API。
    注意 IE8及更低版本中的DOM是通过COM对象实现的。这意味着这些版本的IE中，DOM对象跟原生JavaScript对象具有不同的行为和功能。

    DOM由一系列节点类型构成，主要包括以下几种：
    ❑ Node是基准节点类型，是文档一个部分的抽象表示，所有其他类型都继承Node。
    ❑ Document类型表示整个文档，对应树形结构的根节点。在JavaScript中，document对象是Document的实例，拥有查询和获取节点的很多方法。
    ❑ Element节点表示文档中所有HTML或XML元素，可以用来操作它们的内容和属性。
    ❑ 其他节点类型分别表示文本内容、注释、文档类型、CDATA区块和文档片段。

    要理解DOM，最关键的一点是：知道影响其性能的问题所在。
    DOM操作在JavaScript代码中代价比较高，NodeList对象尤其需要注意。
    NodeList对象是“实时更新”的，意味着每次访问它都会执行一次新的查询。
    考虑到这些问题，实践中要尽量减少DOM操作的数量。

    MutationObserver是为代替性能不好的MutationEvent而问世的。
    使用它可以有效精准地监控DOM变化，而且API也相对简单。