第三章 前端开发学习——BOM/DOM
一、浏览器对象模型BOM
二、文档对象模型DOM
一、浏览器对象模型BOM
什么是浏览器对象模型（下文简称BOM）（what）：
BOM(Browser Object Model) 是指浏览器对象模型，是用于描述这种对象与对象之间层次关系的模型，浏览器对象模型提供了独立于内容的、可以与浏览器窗口进行互动的对象结构。BOM由多个对象组成，其中代表浏览器窗口的Window对象是BOM的顶层对象，其他对象都是该对象的子对象。
BOM的作用（how）：
- 弹出新浏览器窗口的能力；
- 移动、关闭和更改浏览器窗口大小的能力；
- 可提供WEB浏览器详细信息的导航对象；
- 可提供浏览器载入页面详细信息的本地对象；
- 可提供用户屏幕分辨率详细信息的屏幕对象；
- 支持Cookies；
BOM各对象详解：
1.window
window对象是客户端JavaScript的全局对象 是所有客户端JavaScript特性和API的主要接入点 它表示Web浏览器的一个窗口或窗体,并且用标识符window来引用它。
A）属性
- window.innerWidth 窗口的宽
- window.innerHeight 窗口的高
- history 对 History 对象的只读引用
- location 用于窗口或框架的 Location 对象
- screen 对 Screen 对象的只读引用
- navigator 对 Navigator 对象的只读引用
B）方法
- setInterval() 按照指定的周期（以毫秒计）来调用函数或计算表达式
- clearInterval() 取消由 setInterval() 设置的 timeout
- setTimeout() 在指定的毫秒数后调用函数或计算表达式
- clearTimeout() 取消由 setTimeout() 方法设置的 timeout
- Number()
- String()
- Boolean()
- alert() 显示带有一段消息和一个确认按钮的警告框
- confirm() 显示带有一段消息以及确认按钮和取消按钮的对话框
- prompt() 显示可提示用户输入的对话框
2.history
History 对象包含用户（在浏览器窗口中）访问过的 URL。
History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。
A）属性
- length
B）方法
- back() 后退一步
- forward() 前进一步
- go(1) 前进/后退 n 步
3.location
Location 对象包含有关当前 URL 的信息。
Location 对象是 window 对象的一部分，可通过 window.Location 属性对其进行访问。
A）属性
- href 返回完整的URL
- protocol 返回一个URL协议
- host 返回一个URL的主机名和端口
- hostname 返回URL的主机名
- port 返回一个URL服务器使用的端口号
- pathname 返回的URL路径名
- search 返回一个URL的查询部分
- hash 返回一个URL的锚部分
B）方法
assign() 载入一个新的文档
reload() 重新载入当前文档
replace() 用新的文档替换当前文档
4.navigator
A）属性
userAgent 返回由客户机发送服务器的user-agent 头部的值
B）方法
javaEnabled() 指定是否在浏览器中启用Java
taintEnabled() 规定浏览器是否启用数据污点(data tainting)
5.screen
A）属性
availHeight 返回屏幕的高度（不包括Windows任务栏）
availWidth 返回屏幕的宽度（不包括Windows任务栏）
二、文档对象模型DOM
什么是文档对象模型（下文简称DOM）（what）：
- 文档对象模型 Document Object Model
- 文档对象模型 是表示和操作 HTML和XML文档内容的基础API
- 文档对象模型，是W3C组织推荐的处理可扩展标志语言的标准编程接口
DOM分类：
- 核心 DOM - 针对任何结构化文档的标准模型
- XML DOM - 针对 XML 文档的标准模型
- HTML DOM - 针对 HTML 文档的标准模型
常见DOM对象：
- 所有的元素对象 都是dom
- document dom对象 表示整个文档
- document.body 获取body元素
- document.documentElement 获取HTML元素
DOM元素内容：
- innerHTML
- innerText