学习笔记（十）JavaScript Bom（浏览器对象模型）

什么是Bom对象

浏览器对象模型提供了可以与浏览器窗口进行互动的对象结构。
BOM由多个对象组成，其中代表浏览器窗口的Window对象是BOM的顶层对象，其他对象都是该对象的子对象。
BOM提供了一些访问窗口对象的一些方法，我们可以用它来移动窗口位置，改变窗口大小，打开新窗口和关闭窗口，弹出对话框，进行导航以及获取客户的一些信息如：浏览器品牌版本，屏幕分辨率。但BOM最强大的功能是它提供了一个访问HTML页面的一入口——document对象，以使得我们可以通过这个入口来使用DOM的强大功能！！！

Bom和Dom的区别

BOM

1. BOM是Browser Object Model的缩写，即浏览器对象模型。
2. BOM没有相关标准。不同浏览器定义有差别,实现方式不同。
3. BOM的最根本对象是window。

DOM

1. DOM是Document Object Model的缩写，即文档对象模型。
2. DOM是W3C的标准。
3. DOM最根本对象是document（实际上是window.document）。
   DOM的最根本的对象是BOM的window对象的子对象。
   BOM是浏览器对象模型，DOM是文档对象模型，前者是对浏览器本身进行操作，而后者是对浏览器（可看成容器）内的内容进行操作。

window对象

1. innerWidth，innerHeight：页面视口宽高，相当于document.documentElement.clientWidth,document.documentElement.clientHeight
2. outerWidth，outerHeight：浏览器窗口宽高
3. screenLeft，screenTop：当前窗口相对屏幕的坐标，只能获取，不能设置

location对象

1. location.href ：跳转页面，还可以获取当前页面的网址。

   document.οnclick=function(){
       console.log(location.href);
       location.href="http://www.163.com";
   } 
   

2. location.assign(网址)：跳转页面。

3. location.replace(网址)：替换当前页面，也是跳转页面，有历史记录。

4. location.hash：获取地址栏中#后面的内容，也就是锚点标记名

5. location.search：获取地址栏中？后面的内容，？号后面一般是访问地址的参数

6. location.pathname：地址栏中文件路径和名称

7. location.port：地址栏中的端口号

8. location.protocol：地址栏中的协议

9. location.hostname：地址栏中的域名

history对象

1. history.back() ：回退
2. history.forward()：前进
3. history.go(1)：跳转到第几个，负数是回退，正式是前进，0是刷新页面

screen对象

1. screen.width,screen.height ：全屏幕宽高
2. screen.availWidth,screen.availHeight：不带任务栏的屏幕宽高

navigator对象

1. navigator：用户浏览器信息