JS 浏览器BOM模型

BOM

BOM是浏览器对象模型

使用BOM让我们可以通过JS来操作浏览器

在BOM中为我们提供了一组对象，用来完成对浏览器的操作

BOM对象包括

Window

代表的是整个浏览器窗口，同时window也是网页中的全局对象

Navigator

代表的是当前浏览器的信息，通过该对象来识别不同的浏览器

Location

代表当前浏览器的地址栏信息，通过Location可以获取地址栏信息

History

代表浏览器的历史记录，可以通过该对象来操作浏览器的历史记录

由于隐私原因，该对象不能获取到具体的历史记录，只能操作浏览器前后翻页，而且该操作只在当次访问有效

Screen

代表用户的屏幕的信息，通过该对象可以获取到用户的显示器的信息

Window

Navigator

代表当前浏览器的信息，通过该对象可以识别不同的浏览器，由于历史原因，Navigator对象中的大部分属性已经无法帮助我们识别浏览器了，一般我们只会使用userAgent来判断浏览器信息。

userAgent是一个字符串，这个字符串包含有用来描述浏览器信息的内容，不同的浏览器会有不同的userAgent

可以封装一个方法，通过正则表达式来判断字符串，来判断浏览器信息。

var ua = navigator.userAgent;
if(/firefox/i.test(ua)){
      alert("火狐")
}else if(/chorme/i.test(ua)){
      alert("谷歌")
}else if(/msie/i.test(ua)){
      alert("IE11以下")
}else if("ActiveXObject" in window){
      alert("IE11")
}

Location

如果直接打印location，则可以获取到地址栏信息（当前页面的完整路径）

如果直接将location的值修改为一个完整的路径，或者相对路径，则我们的页面会自动跳转到该路径，并且生成历史记录

location的方法：

assign（）

用来跳转到其他页面，作用和直接修改location一样

reload（）

用于重新加载当前页面，作用与刷新按钮一样

如果在方法中传入一个true作为参数，则会强制清空缓存页面，刷新数据

replace（）

可以使用一个页面替换当前页面，调用完毕不会生成历史记录

History

History.length 可以获取当前范文的连接数量

History.back 可以回退上一个页面，作用和浏览器的回退按钮一样

History.forward 可以前进到下一个页面，与浏览器前进按钮一样

HisTory.go(); 可以设置前进或后退的数量