BOM

浏览器对象模型
BOM能够使咱们通过JS来操作浏览器
在BOM中为咱们提供了一组对象,用来实现对浏览器的操作
BOM对象

Window

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

Navigator

代表的以后浏览器的信息,通过该对象能够来辨认不同的浏览器

Location

代表以后浏览器的地址栏信息,通过Location能够获取地址栏信息,或者操作浏览器跳转页面

History

代表浏览器的历史记录,能够通过该对象来操作浏览器的历史记录
因为隐衷起因,该对象不能获取到具体的历史记录,只能操作浏览器向前或向后翻页
而且该操作只在当次访问时无效

Screen

代表用户的屏幕的信息,通过该对象能够获取到用户的显示器的相干的信息

这些BOM对象在浏览器中都是作为window对象的属性保留的,
能够通过window对象来应用,也能够间接应用

//console.log(navigator);//console.log(location);//console.log(history);

Navigator

代表的以后浏览器的信息,通过该对象能够来辨认不同的浏览器
因为历史起因,Navigator对象中的大部分属性都曾经不能帮忙咱们辨认浏览器了
个别咱们只会应用userAgent来判断浏览器的信息,

userAgent

是一个字符串,这个字符串中蕴含有用来形容浏览器信息的内容,
不同的浏览器会有不同的userAgent
火狐的userAgent

         *     Mozilla/5.0 (Windows NT 6.1; WOW64; rv:50.0) Gecko/20100101 Firefox/50.0         * 

Chrome的userAgent

         *  Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.82 Safari/537.36         * 

IE8

         *     Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)         * 

IE9

         *     Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)         * 

IE10

         *     Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E)         * 

IE11

         *     Mozilla/5.0 (Windows NT 6.1; WOW64; Trident/7.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; .NET4.0C; .NET4.0E; rv:11.0) like Gecko

在IE11中曾经将微软和IE相干的标识都曾经去除了,所以咱们根本曾经不能通过UserAgent来辨认一个浏览器是否是IE了

        //alert(navigator.appName);                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,枪毙了你~~~");        }        

如果通过UserAgent不能判断,还能够通过一些浏览器中特有的对象,来判断浏览器的信息
比方:

ActiveXObject        if("ActiveXObject" in window){            alert("你是IE,我曾经抓住你了~~~");        }else{            alert("你不是IE~~~");        }                /*alert("ActiveXObject" in window);*/

History
对象能够用来操作浏览器向前或向后翻页

window.onload = function(){                

获取按钮对象

var btn = document.getElementById("btn");btn.onclick = function(){length

属性,能够获取到当成拜访的链接数量

    alert(history.length);back()

能够用来回退到上一个页面,作用和浏览器的回退按钮一样

    history.back();forward()

能够跳转下一个页面,作用和浏览器的后退按钮一样

history.forward();    go()

能够用来跳转到指定的页面
它须要一个整数作为参数
1:示意向前跳转一个页面 相当于forward()
2:示意向前跳转两个页面
-1:示意向后跳转一个页面
-2:示意向后跳转两个页面

    history.go(-2);    

Location
该对象中封装了浏览器的地址栏的信息

    window.onload = function(){获取按钮对象    var btn = document.getElementById("btn");    btn.onclick = function(){

如果间接打印location,则能够获取到地址栏的信息(以后页面的残缺门路)

    alert(location);

如果间接将location属性批改为一个残缺的门路,或相对路径
则咱们页面会主动跳转到该门路,并且会生成相应的历史记录

    location = "http://www.baidu.com";    location = "01.BOM.html";assign()

用来跳转到其余的页面,作用和间接批改location一样

    reload()

用于从新加载以后页面,作用和刷新按钮一样
如果在办法中传递一个true,作为参数,则会强制清空缓存刷新页面

    location.reload(true);replace()

能够应用一个新的页面替换以后页面,调用结束也会跳转页面
不会生成历史记录,不能应用回退按钮回退

    location.replace("01.BOM.html");        };    };