HTML DOM则是专门适用与 HTML最佳化
HTML/XHTML的文档对象模型。熟悉软件开发的人员可以将HTML DOM理解为网页的API。它将网页中的各个元素都看作一个个对象，从而使网页中的元素也可以被计算机语言获取或者编辑。 例如Javascript就可以利用HTML DOM动态的修改网页。
这个网址讲的很详细 http://www.w3school.com.cn/htmldom/
注意 ：方法 ① ② 相当于在当前 window.document 上 createElement ，创建的 div 是要被浏览器遍历的，而方法 ③④ 是新创建一个 document 与浏览器里的不是一个，和浏览器没关系，浏览器也不会遍历。这种区别可以在有 <img>标签的 html 中有所体现。
【1】问题：设置 display：none 的 img 还会加载吗？会的
而 display：none 只会影响渲染树的隐藏和显示，因此设置了 display：none 也依然会加载。
总结 ： <img>标签只要存在在 dom 里就会加载，阻止他被浏览器遍历从而加载的方式就是不让他出现在 window.document 里。
【2】问题：样式表中的背景图片设置了 display：none 还会加载吗？会的
【3】问题：样式表中的背景图片的父元素设置了 display：none 还会加载吗？不会
构建渲染树时父元素设为 none，则默认子元素也不渲染，也就遍历不到了，因此不会渲染。
好处：
缺点：domparser api 的性能最差 可参考： 性能对比
所以有快速生成的需求时，尽量不要用 DOMParser
好处是，性能最优，因为文档片段存在于内存中，子元素插入到问的文档片段时不会引起回流，有较好的性能。
去除 html 里多余的无用的标签或者注释等，省去用正则表达式，因为可能存在 <br/><hr/>等不好筛选
DOMParser WEB API
web 图片资源加载与渲染时机
DOM 是 W3C（万维网联盟）的标准。
DOM 定义了访问 HTML 和 XML 文档的标准：
"W3C 文档对象模型 （DOM） 是中立于平台和语言的接口，它允许程序和脚本动态地访问和更新文档的内容、结构和样式。"
W3C DOM 标准被分为 3 个不同的部分：
核心 DOM - 针对任何结构化文档的标准模型
XML DOM - 针对 XML 文档的标准模型
HTML DOM - 针对 HTML 文档的标准模型
HTML DOM 是：
HTML 的标准对象模型
HTML 的标准编程接口
W3C 标准
