Navigator對象詳解

Navigator對象概述

Navigator對象包含有關瀏覽器的信息

console.log(navigator)

userAgent屬性 【重點】

var ua = navigator.userAgent;
console.log(ua)

win google  
"Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36"

試用場景

var browser = {
      versions: function() {
        var ua = navigator.userAgent;
        var versions = {
          trident: ua.indexOf('Trident') > -1, //IE內核
          presto: ua.indexOf('Presto') > -1, //opera內核
          webKit: ua.indexOf('AppleWebKit') > -1, //蘋果、谷歌內核
          gecko: ua.indexOf('Gecko') > -1 && ua.indexOf('KHTML') == -1, //火狐內核
          mobile: !!ua.match(/AppleWebKit.*Mobile.*/), //是否爲移動終端
          ios: !!ua.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端
          android: ua.indexOf('Android') > -1 || ua.indexOf('Adr') > -1, //android終端
          iPhone: ua.indexOf('iPhone') > -1, //是否爲iPhone或者QQHD瀏覽器
          iPad: ua.indexOf('iPad') > -1, //是否iPad
          webApp: ua.indexOf('Safari') == -1, //是否web應該程序，沒有頭部與底部
          weixin: ua.indexOf('MicroMessenger') > -1, //是否微信 （2015-01-22新增）
          qq: ua.match(/\sQQ/i) == " qq" //是否QQ
        }
        return versions;
      }(),
      language: (navigator.browserLanguage || navigator.language).toLowerCase(),
      network: function() {
        var ua = navigator.userAgent;
        var networkStr = ua.match(/NetType\/\w+/) ? ua.match(/NetType\/\w+/)[0] : 'NetType/other';
        networkStr = networkStr.toLowerCase().replace('nettype/', '');
        var network;
        switch (networkStr) {
          case 'wifi':
            network = 'wifi';
            break;
          case '4g':
            network = '4g';
            break;
          case '3g':
            network = '3g';
            break;
          case '3gent':
            network = '3g';
            break;
          case '2g':
            network = '2g';
            break;
          default:
            network = 'other';
        }
        return network;
      }()
    }

• 判斷設備是否微信內置瀏覽器打開

if (browser.versions.weixin) {
    
}

• 判斷設備是否移動端或者PC端

if (browser.versions.mobile) {
    
} else {
    
}

• 判斷是ios設備還是android設備

if (browser.versions.ios) {
    
} else if(browser.versions.android){
    
}else {
    
}

總結

userAgent 瀏覽器數據收集、自適應等方向。

結束語

• 天生我才必有用
• 把所有平凡的事都做好