第五章 BOM和DOM基础

01.BOM

BOM即浏览器对象模型，其核心对象是window，它表示浏览器的一个实例。在浏览器中，window对象有双重角色，它既是通过JavaScript访问浏览器窗口的一个接口，又是ECMAScript规定的Global对象。所有浏览器都支持该对象，浏览器对象模型如图所示

在浏览器里一般调用window下的子模块不需要写出window，如window.document等价于document，一般常用document对象，即文档对象模型（Document Object Model）。

window常用子对象

1）history对象
该对象表示当前窗口的浏览历史，使用方法为window.history.[属性|方法]，history对象常用方如表：

方法	意义
back()	显示浏览器的历史列表中后退一个网址的网页
forward()	显示浏览器的历史列表中前进一个网址的网页
go(n)/go(url)	显示浏览器的历史列表中第n个网址的网页，n>0表示前进，反之，n<0表示后退或显示浏览器的历史列表中对应的url网页

**注意：**从窗口被打开的那一刻开始记录，每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。
2）location对象
location用于获取或设置窗体的URL，并且可以用于解析URL。使用方法也是location.[属性|方法]，location对象包括的属性与方法如表：

属性与方法	意义
href	整个url字串
protocol	url中从开始至冒号（包括冒号）表示通信协议的字串
hostname	URL中服务器名、域名、子域名或IP地址
port	url中端口名
host	url中hostname和port部分
pathname	url中文件名或路径名
hash	url中由#开始的锚点名称
search	url中从问好开始至结束的表示变量的字串
reload([是否从服务器端刷新])	刷新当前网页，其中“是否从服务器端刷新”的值是true或false
replace(url)	用url网址刷新当前的网页

3）navigator对象
Navigator 对象包含有关浏览器的信息，通常用于检测浏览器与操作系统的版本。navigator对象常用属性如表：
appCodeName 浏览器代码名的字符串表示
appName 返回浏览器的名称
appVersion 返回浏览器的平台和版本信息
platform 返回运行浏览器的操作系统平台
userAgent 返回由客户机发送服务器的user-agent头部值

属性	描述
appCodeName	浏览器代码名的字符串表示
appName	返回浏览器的名称
appVersion	返回浏览器的平台和版本信息
platform	返回运行浏览器的操作系统平台
userAgen	返回由客户机发送服务器的user-agent头部值

4）screen对象
screen对象用于获取用户的屏幕信息。使用方法为window.screen.属性，screen对象常用属性如表。

属性	描述
availHeight	窗口可以使用的屏幕高度，单位像素
availWidth	窗口可以使用的屏幕宽度，单位像素
colorDepth	用户浏览器表示的颜色位数，通常为32位（每像素位的位数）
pixelDepth	用户浏览器表示的颜色位数，，通常为32位（每像素位的位数）（IE不支持此属性）
height	屏幕的高度，单位像素
width	屏幕的宽度，单位像素

02.DOM

如上所说，DOM即文档对象模型”(Document Object Model)，是window的子对象，也是JavaScript操作网页的接口，特别常用则单独拎出。写了半天感觉写不好，可以参考博客《DOM》，比较专业讲解。
最后附window和DOM的思维导图

window思维导图

DOM思维导图

后续持续更新……
原创不易，如果觉得不错，就点个赞吧！