关于javascript:JavaScript基础11BOM

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");
        };
    };