BOM学习实用路线（7）——BOM之navigator和screen

navigator 对象

---

- userAgent - appName - appVersion

navigator关于存储设备信息及当前浏览器的一些东西。

console.log(navigator);

appVersion 获取当前浏览器的版本号

language 当前使用的语言

onLine 是否有网

userAgent 用户代理信息

切换手机模式，userAgent会发生变化

那么navigator对象经常用在哪里呢？我们可以借助userAgent来判断设备：

{
    // 判断当前是否是PC
    function IsPC() {
        var userAgentInfo = navigator.userAgent;
        var Agents = ["Android", "iPhone",
                "SymbianOS", "Windows Phone",
                "iPad", "iPod"];
        var flag = true;
        
        for (let index = 0; index < Agents.length; index++) {
            if (userAgentInfo.indexOf(Agents[index]) > 0){
                flag = false;
                break;
            }
        }

        return flag;
    };

    console.log(IsPC());
}

我们可以轻松验证此时的设备：

navigator对象除了可以判断设备，还可以判断什么类型的设备，客户端（及它的版本号）及浏览器的判别等等，这里需要navigator.userAgent进行字符串解析（需要转成小写，方便我们判断），这里涉及了正则表达式，小编将在后续章节分享。

// 判断当前是否是PC
function IsPC() {
    var userAgentInfo = navigator.userAgent;
    var Agents = ["Android", "iPhone",
                "SymbianOS", "Windows Phone",
                "iPad", "iPod"];
    var flag = true;
    for (var v = 0; v < Agents.length; v++) {
        if (userAgentInfo.indexOf(Agents[v]) > 0) {
            flag = false;
            break;
        }
    }
    return flag;
}    

{
let ua = navigator.userAgent.toLowerCase();  // 转成小写，方便统一去判断
if (/android|adr/gi.test(ua)) {
    // 安卓
    console.log("安卓");
    } else if(/\(i[^;]+;( U;)? CPU.+Mac OS X/gi.test(ua)){
        //苹果
        console.log("苹果");
    }
}

screen 对象

---

width 、height

注意：它的兼容性不太好，width 、height用得多一些

console.log(screen);

具体使用我们再后续篇章再做阐述。

（后续待补充）