本文提供一段基于 navigator.userAgent 的 JavaScript 代码,用于检测浏览器类型、版本号、渲染内核、操作系统及是否处于移动端环境。通过正则匹配解析 UA 字符串,返回包含浏览器标识、版本、内核、OS 及移动状态的对象,适用于前端兼容性判断场景。
浏览器信息检测逻辑概述
本文旨在介绍如何检测浏览器版本、核心引擎、操作系统以及判断当前设备是否为移动端。
浏览器检测代码实现
具体实现代码如下:
/**
* 检查浏览器版本信息
* 作者:K
* 日期:2014-04-11 14:48:39
* 版本:1
*/
/**
* 利用 navigator.userAgent 检测浏览器信息
* @return {object} 浏览器信息对象
*/
var browser = (function(){
var userAgent = navigator.userAgent,
ua = userAgent.toLowerCase(),
browserList = {
msie : /(?:msie\s|trident.*rv:)([\w.]+)/i,
firefox : /Firefox\/([\w.]+)/i,
chrome : /Chrome\/([\w.]+)/i,
safari : /version\/([\w.]+).*Safari/i,
opera : /(?:OPR\/|Opera.+version\/)([\w.]+)/i
},
kernels = {
MSIE: /(compatible;\smsie\s|Trident\/)[\w.]+/i,
Camino: /Camino/i,
KHTML: /KHTML/i,
Presto: /Presto\/[\w.]+/i,
Gecko : /Gecko\/[\w.]+/i,
WebKit: /AppleWebKit\/[\w.]+/i
},
browser = {
kernel : 'unknow',
version : 'unknow'
}
// 检测浏览器类型
for(var i in browserList){
var matchs = ua.match(browserList[i]);
browser[i] = matchs ? true : false;
if(matchs){
browser.version = matchs[1];
}
}
// 检测渲染引擎
for(var i in kernels){
var matchs = ua.match(kernels[i]);
if(matchs){
browser.kernel = matchs[0];
}
}
// 检测操作系统
var os = ua.match(/(Windows\sNT\s|Mac\sOS\sX\s|Android\s|ipad.*\sos\s|iphone\sos\s)([\d._-]+)/i);
browser.os = os!==null ? os[0] : false;
// 判断是否移动端
browser.mobile = ua.match(/Mobile/i)!==null ? true : false;
return browser;
}());