JavaScript基础(15_BOM对象)
BOM对象
BOM对象
-
浏览器对象模型
-
BOM可以使我们通过js来操作浏览器
-
在BOM中提供了一组对象，用来完成对浏览器的操作
-
Window
-
代表整个浏览器的窗口，同时window也是网页中的全局对象
-
-
Navigator
-
代表当前浏览器的信息，通过该对象可以来识别不同的浏览器
-
由于历史原因，Navigator对象中的大部分属性都已经不能帮助我们识别浏览器了
-
一般我们只会使用userAgent来判断浏览器信息
-
ua是一个字符串，包含了描述了浏览器信息的字符串
-
-
-
Location
-
代表当前浏览器的地址栏信息，通过location可以跳转页面
-
-
History
-
代表浏览器的历史记录
-
由于隐私原因，该对象不能获取到具体的历史记录，
-
只能操作浏览器向前或者后退功能
-
而且该操作只在当次有效
-
-
-
Screen代表用户的屏幕的信息，显示器的相关信息
-
代表用户的屏幕的信息，显示器的相关信息
-
-
这些DOM对象在浏览器中都是作为window的属性保存的
-
可以通过window对象来使用，也可以直接使用
-
-
使用BOM对象判断浏览器
-
chrome userAgent:
-
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.80 Safari/537.36
-
-
firefox userAgent:
-
Mozilla/5.0 (Macintosh; Intel Mac OS X 10.13; rv:68.0) Gecko/20100101 Firefox/68.0
-
-
safari userAgent:
-
Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_1) AppleWebKit/604.3.5 (KHTML, like Gecko) Version/11.0.1 Safari/604.3.5
-
-
IE8-IE10
-
均会出现MSIE标识字样，来确认浏览器的类型和版本
-
但是到IE11时，MSIE字样标识已经彻底没有了，无法通过这个方式来判断
-
注意：此时通过ua无法精准的判断浏览器类型是否为IE了，我们还可以通过一些浏览器中特有的对象，来判断浏览器信息
-
比如IE中特有的对象:
-
ActiveXobject 【if(ActiveXobject)】【if("ActiveXobject" in window)】
-
-
-
案例
-
var ua = navigator.userAgent; console.log(ua); if(/firefox/i.test(ua)){ alert("你是火狐"); }else if(/chrome/i.test(ua)){ alert("你是chrome"); }else if(/msie/i.test(ua)){ alert("IE浏览器"); }else if ("ActiveXobject" in window){ alert("你是IE11浏览器!"); };
-
BOM对象-history
-
length
-
属性，可以获取到当前访问页面的连接数量
-
-
back()
-
可以用来回退到上一个页面，作用和浏览器的回退按钮一样,往后退一个页面
-
-
forward()
-
可以跳转到下一个页面，作用和浏览器的前进按钮一样,往前进一个页面
-
-
go()
-
可以用来跳转到指定的页面
-
它需要一个整数作为参数
-
参数=1 表示向前跳转一个页面
-
参数=2 表示想前跳转两个页面
-
参数=-1 表示向后跳转一个页面
-
参数=-2 表示想后跳转两个页面
-
-
BOM对象-location
-
如果将location属性改为一个完整的路径，或者相对路径
-
则我们页面会自动跳转到该路径，并生成历史记录
-
assign()
-
用来跳转到其他的页面，作用和直接修改location效果一样
-
-
reload()
-
用于重新加载当前页面，作用和刷新按钮一样
-
如果再方法中传递参数：true 表示强制清空缓存刷新页面
-
-
replace()
-
可以使用一个新的页面替换当前页面，调用完毕也会跳转页面
-
-
-
