一、来源
DOM.BOM文档对象模型（Document Object Model，简称DOM），是W3C推荐的处理可扩展标志语言的标准编程接口。Document Object Model的历史可以追溯至1990年代后期微软与Netscape的“浏览器大战”，双方为了在JavaScript与JScript一决生死，于是大规模的赋予浏览器强大的功能。微软在网页技术上加入了不少专属事物，计有VBScript、ActiveX、以及微软自家的DHTML格式等，使不少网页使用非微软平台及浏览器无法正常显示。DOM即是当时酝酿出来的杰作。
BOM(Browser Object Mode) 是指浏览器对象模型，是用于描述这种对象与对象之间层次关系的模型，浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成，其中代表浏览器窗口的Windows对象是BOM的顶层对象，其他对象都是该对象的子对象。
二、使用方法
HTML DOM的使用方法：
| getElementById() | 返回带有指定 ID 的元素。 |
| getElementsByTagName() | 返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）。 |
| getElementsByClassName() | 返回包含带有指定类名的所有元素的节点列表。 |
| appendChild() | 把新的子节点添加到指定节点。 |
| removeChild() | 删除子节点。 |
| replaceChild() | 替换子节点。 |
| insertBefore() | 在指定的子节点前面插入新的子节点。 |
| createAttribute() | 创建属性节点。 |
| createElement() | 创建元素节点。 |
| createTextNode() | 创建文本节点。 |
| getAttribute() | 返回指定的属性值。 |
| setAttribute() | 把指定属性设置或修改为指定的值。 |
JavaScript BOM的使用方法：
open()：打开一个新的页面，格式为open(页面的url,打开的方式)，如果url为空则打开一个空白页面。如果打开方式为空，默认为新窗口方式打开。这个方法返回新窗口的window对象。
close()：关闭一个页面，但是这个方法有点兼容性问题，firefox默认无法关闭，chrome默认直接关闭，ie：询问用户。
navigator.userAgent：返回浏览器的名称和版本。
location：浏览器地址信息，本身不是字符串，是object格式。
location：就是url地址本身。
location.search：url中?后面的内容。
location.hash：url中#后面的内容。
取自：https://blog.csdn.net/qq_33837446/article/details/77523344 &菜鸟教程网
三、应用
DOM：
（一）创建DOM元素：createElement
（二）插入DOM元素：insertBefore
（三）删除DOM元素：removeChild
（四）文档碎片
BOM：
（一）打开、关闭浏览器
（二）限制尺寸及坐标：
（三）window对象（例如返回顶部按钮）
（四）警告框：alert（‘内容’）；没有返回值
选择框：confirm（‘提问的内容’），返回Boolean
输入框：prompt（），返回字符串
取自：https://blog.csdn.net/qq_37994920/article/details/82382994
四、内容
DOM 是 W3C（万维网联盟）的标准。DOM 定义了访问 HTML 和 XML 文档的标准；
改变 HTML 内容（改变元素内容的最简单的方法是使用 innerHTML 属性）
改变 HTML 样式（通过 HTML DOM，您能够访问 HTML 对象的样式对象）
BOM 是 各个浏览器厂商根据 DOM在各自浏览器上的实现。