JS之BOM篇-navigator对象
navigator对象常用于识别客户端浏览器
属性
每个浏览器中的navigator对象都有一套自己的属性
属性 说明
appCodeName 浏览器名称[所有浏览器都返回Mozilla]
userAgent 浏览器的用户代理字符串
appVersion 浏览器版本
appMinorVersion 次版本信息[IE返回0，chrome和firefox不支持]
platform 浏览器所在的系统平台[所有浏览器都返回Win32]
plugins 浏览器中安装的插件信息的数组
mimeTypes 在浏览器中注册的MIME类型数组
language 浏览器主语言[IE10-不支持，其他浏览器返回zh-CN]
systemLanguage 操作系统语言[IE返回zh-CN，chrome和firefox不支持]
userLanguage 操作系统默认语言[IE返回zh-CN，chrome和firefox不支持]
product 产品名称[IE10-不支持，其他浏览器返回Gecko]
productSub 产品次要信息[IE不支持，chrome返回20030107，firefox返回20100101]
vendor 浏览器品牌[chrome返回Google Inc.，IE和firefox不支持]
onLine 是否连接因特网[IE根据实际情况返回true或false，chrome和firefox始终返回true]
cookieEnabled 表示cookie是否启用[所有浏览器都返回true]
javaEnabled 是否启用java[IE8-浏览器返回{}，其他浏览器返回function javaEnabled()]
buildID 浏览器编译版本[firefox返回20170125094131，chrome和IE不支持]
cpuClass 计算机使用的CPU类型[IE返回x86，chrome和firefox不支持]
oscpu 操作系统或使用的CPU[firefox返回Windows NT 10.0; WOW64，chrome和IE不支持]
navigator对象有很多属性，最常用的只有userAgent属性，常用于实现用户代理检测。
用户代理检测
不同平台下浏览器的userAgent检测结果
【IE3】
Mozilla/2.0 (compatible; MSIE3.02; windows 95)
【IE6】
Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1)
【IE7】
Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 6.0)
【IE8】
Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.1; Trident/4.0)
【IE9】
Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0)
【IE10】
Mozilla/5.0 (compatible; MSIE 10.0; Windows NT 6.2; Trident/6.0)
【IE11】
Mozilla/5.0 (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; .NET4.0C; .NET4.0E; InfoPath.3; GWX:QUALIFIED; rv:11.0) like Gecko
【chrome】
Mozilla/5.0 (Windows NT 6.1; WOW64)G AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.93 Safari/537.36
【safari】
Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.57.2 (KHTML, like Gecko) Version/5.1.7 Safari/534.57.2
【firefox】
Mozilla/5.0 (Windows NT 6.1; WOW64; rv:40.0) Gecko/20100101 Firefox/40.0
【opera】
Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.85 Safari/537.36 OPR/32.0.1948.25
【ipad】
Mozilla/5.0 (iPad; CPU OS 7_0 like Mac OS X) AppleWebKit/537.51.1 (KHTML, like Gecko) Version/7.0 Mobile/11A465 Safari/9537.53
【iphone】
Mozilla/5.0 (iPhone; CPU iPhone OS 8_0 like Mac OS X) AppleWebKit/600.1.3 (KHTML, like Gecko) Version/8.0 Mobile/12A4345d Safari/600.1.4
【android】
Mozilla/5.0 (Linux; Android 4.2.2; GT-I9505 Build/JDQ39) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/31.0.1650.59 Mobile Safari/537.36
识别内核
常见的内核有Trident、Gecko和WebKit
function whichEngine(){
var ua = navigator.userAgent;
//Trident内核
if(/Trident/.test(ua)){
return "Trident";
}
//Webkit内核
if(/WebKit/.test(ua)){
return "WebKit";
}
//Gecko内核
if(/Gecko/.test(ua)){
return "Gecko";
}
}
// IE11下显示"Trident"
// chrome下显示"WebKit"
// firefox下显示"Gecko"
注意： 因为Trident和WebKit的用户代理字符串中可能会出现like Gecko的字眼，所以需要最后再测Gecko
识别浏览器
IE
function isIE() {
var ua = navigator.userAgent;
//检测Trident引擎，IE8+
if (/Trident/.test(ua)) {
//IE11+
if (/rv:(\d+)/.test(ua)) {
return RegExp["$1"];
}
//IE8-IE10
if (/MSIE (\d+)/.test(ua)) {
return RegExp["$1"];
}
}
//检测IE标识，IE7-
if (/MSIE (\d+)/.test(ua)) {
return RegExp["$1"];
}
}
console.log(isIE()); // 只有IE会返回版本号，其他浏览器都返回undefined
chrome
function isChrome() {
var ua = navigator.userAgent;
//先排除opera,因为opera只是在chrome的userAgent后加入了自己的标识
if (!/OPR/.test(ua)) {
if (/Chrome\/(\S+)/.test(ua)) {
return RegExp["$1"];
}
}
}
console.log(isChrome()); // 只有Chrome会返回版本号，其他浏览器都返回undefined
safari
function isSafari() {
var ua = navigator.userAgent;
//先排除opera
if (!/OPR/.test(ua)) {
//检测出chrome和safari浏览器
if (/Safari/.test(ua)) {
//检测出safari
if (/Version\/(\S+)/.test(ua)) {
return RegExp["$1"];
}
}
}
}
console.log(isSafari()); // 只有safari会返回版本号，其他浏览器都返回undefined
firefox
function isFireFox() {
if (/Firefox\/(\S+)/.test(navigator.userAgent)) {
return RegExp["$1"];
}
}
console.log(isFireFox()); // 只有firefox会返回版本号，其他浏览器都返回undefined
opera
function isOpera() {
if (/OPR\/(\S+)/.test(navigator.userAgent)) {
return RegExp["$1"];
}
}
console.log(isOpera()); // 只有opera会返回版本号，其他浏览器都返回undefined
识别操作系统
function whichSystem() {
var ua = navigator.userAgent;
var pf = navigator.platform;
if (/Mac/.test(pf)) {
return "Mac";
}
if (/X11/.test(pf) || /Linux/.test(pf)) {
return "Linux";
}
if (/Win/.test(pf)) {
if (/Windows NT (\d+\.\d+)/.test(ua)) {
switch (RegExp["$1"]) {
case "5.0":
return "Windows 2000";
case "5.1":
return "Windows XP";
case "6.0":
return "Windows Vista";
case "6.1":
return "Windows 7";
case "6.2":
return "Windows 8";
case "6.3":
return "Windows 8.1";
case "6.4":
case "10.0":
return "Windows 10";
}
}
}
}
console.log(whichSystem()) // Windows 10
识别移动端
function whichMobile() {
var ua = navigator.userAgent;
if (/iPhone OS (\d+_\d+)/.test(ua)) {
return 'iPhone' + RegExp.$1.replace("_", ".");
}
if (/iPad.+OS (\d+_\d+)/.test(ua)) {
return 'iPad' + RegExp.$1.replace("_", ".")
}
if (/Android (\d+\.\d+)/.test(ua)) {
return 'Android' + RegExp["$1"];
}
}
console.log(whichMobile()) // Android6.0
