一、什么是DOM？
DOM（Document Object Model，文档对象模型），是W3C组织推荐的处理可扩展标记语言（HTML或XML）的标准编程接口。它的作用是通过这些DOM接口可以改变网页的内容、结构和样式。
在DOM中，HTML文档的层次结构被表示为一个树形结构。树的每个子节点表示HTML文档中的不同内容。
文档：一个页面就是一个文档，DOM中使用document表示元素：页面中的所有标签都是元素，DOM中使用element表示节点：网页中的所有内容都是节点（标签、属性、文本、注释等），DOM中使用node表示
用DOM API操作这个 HTML 的内容（比如添加某些元素、修改元素的内容、删除某些元素）
DOM操作举例：
1.访问节点
2.节点操作：
二、什么是BOM？
BOM(Browser Object Model，浏览器对象模型)，它提供了独立于内容而与浏览器窗口进行交互的对象。它由window、location、navigator、screen、history、frames对象组成，我们可以用它来移动窗口位置，改变窗口大小，打开新窗口和关闭窗口，弹出对话框，进行导航以及获取客户的一些信息如：浏览器品牌版本，屏幕分辨率等。
其核心对象是window，其他的对象为：location、navigator、screen、history、frames，称为window的子对象，是以属性的方式添加到window对象的。
console.log(window.location === location); //true
console.log(window.navigator === navigator); //true
console.log(window.screen === screen); //true
console.log(window.history === history); //true
console.log(window.window === window); //true
BOM 缺乏标准，我们都知道JavaScript 语法的标准化组织是 ECMA，DOM 的标准化组织是 W3C，BOM 没有相关的标准，因为是针对浏览器的，所以不同的浏览器实现同一功能，可以需要不同的实现方式。
三、DOM和BOM的关系？
BOM与DOM的结构层次图
在BOM和DOM结构层次图中，DOM的最根本的对象是BOM的window对象的子对象，所以DOM也可以看作是BOM的一部分。
验证：console.log(window.document === document);
因为document是DOM的根节点，而以上代码又表明：document在window对象中是作为其一个属性而存在的，因此从这个角度来说，BOM包含了DOM。
浏览器提供出来给予访问的是BOM对象，从BOM对象再访问到DOM对象，从而js可以操作浏览器以及浏览器读取到的文档。
只不过区别是：DOM描述了处理网页内容的方法和接口，BOM描述了与浏览器进行交互的方法和接口。
四、总结：
1.DOM 是文档对象模型，BOM是浏览器对象模型
2.DOM就是把文档当做一个对象来看待，BOM是把浏览器当做一个对象来看待
3.DOM的顶级对象是document（实际上是window.document），BOM的顶级对象是window
4.DOM 主要学习的是操作页面元素，BOM学习的是浏览器窗口交互的一些对象
5.DOM是W3C标准规范，BOM是浏览器厂商在各自浏览器上定义的，兼容性较差
