js笔记系列之--Navigator对象理解及判断

js入门系列之

位置及相对位置事件坐标

Navigator对象
在写前端页面的时候，我们会碰到不同浏览器下不同逻辑的情况。这个时候我们就有必要通过js代码来确认当前浏览器的种类以及版本，这个时候我们就需要借助窗口中的navigaitor对象。首先我们来了解一下navigator，在控制栏输出看一下：

图片描述

下面我们来解释一下对象中对应各属性的概念：

appCodeName    浏览器的代码名。
appMinorVersion    浏览器的次级版本。
appName    浏览器的名称。
appVersion    浏览器的平台和版本信息。
browserLanguage    当前浏览器的语言。
cookieEnabled    指明浏览器中是否启用 cookie 的布尔值。
cpuClass    浏览器系统的 CPU 等级。
onLine    指明系统是否处于脱机模式的布尔值。
platform    运行浏览器的操作系统平台。
systemLanguage     OS 使用的默认语言。
userAgent    由客户机发送服务器的 user-agent 头部的值。
userLanguage    OS 的自然语言设置。

了解了navigator下对应的属性信息，我们可以获取很多有效的信息，比如当前的浏览器、浏览器版本以及当前电脑操作系统等等~是不是很棒棒呢~下面我们来写一段简单的代码来判断当前的浏览器：

var UserAgent =window.navigator.userAgent.toLowerCase();
function getBrowserType(UserAgent){
var result={
      isIE6: /msie 6.0/.test(UserAgent), // IE6
      isIE7: /msie 7.0/.test(UserAgent), // IE7
      isIE8: /msie 8.0/.test(UserAgent), // IE8
      isIE9: /msie 9.0/.test(UserAgent), // IE9
      isIE10: /msie 10.0/.test(UserAgent), // IE10
      isIE11: /msie 11.0/.test(UserAgent), // IE11
      isLB: /lbbrowser/.test(UserAgent), // 猎豹浏览器
      isUc: /ucweb/.test(UserAgent), // UC浏览器
      is360: /360se/.test(UserAgent), // 360浏览器
      isBaidu: /bidubrowser/.test(UserAgent), // 百度浏览
      isSougou: /metasr/.test(UserAgent), // 搜狗浏览器
      isChrome: /chrome/.test(UserAgent), 
      //Chrome浏览器
      isFirefox: /firefox/.test(UserAgent), // 火狐浏览器
      isOpera: /opera/.test(UserAgent), // Opera浏览器
      isSafiri: /safari/.test(UserAgent) && !/chrome/.test
 (UserAgent), // safire浏览器
      isQQ: /qqbrowser/.test(UserAgent)//qq浏览器
    };
 return result;
}
console.log(getBrowserType(UserAgent));

下图则是代码运行的结果：

图片描述

就这样，我们可以简单的判断当前浏览器的种类从而达到分浏览器处理的效果了~

js入门系列之

位置及相对位置事件坐标

猜你喜欢