|
识别平台
目前有三大主流平台(windows,Mac,Unix(包括各种linux))；因为那些浏览器(safari,opera,firefox)在不同的平台可能会有不同的问题；为了检测这些平台，还需要像下面这样再添加一个新对象；
var client = function(){
var engine = {
// 呈现引擎
ie: 0,
gecko:0,
webkit: 0,
khtml:0,
opera:0,
//其他版本号
ver: null
};
var browser = {
// 浏览器
ie: 0,
firefox:0,
safari:0,
konq:0,
opera:0,
chrome:0,
// 其他的版本
ver: null
};
var system = {
win: false,
mac: false,
xll: false
};
// 在此检测呈现引擎，平台和设备
return {
engine: engine,
browser: browser,
system: system
};
}();
如上的代码添加了一个包含3个属性的新变量system，其中，win属性表示是否为windows平台，mac代表Mac，xll代表是Unix，system的对象的属性默认都为false，在确定平台时，检测navigator.platform要比检测用户代理字符串更简单，检测用户代理字符串在不同的浏览器中会给出不同的平台信息，而navigator.platform属性可能的值包括”Win32”,”Win64”,”MacPPC”,”MacIntel”,”Xll”和”Linux i686”,这些值在不同的浏览器中都是一致的，检测代码非常直观；如下代码：
var system = client;
var platform = navigator.platform;
system.win = platform.indexOf("Win") == 0;
system.mac = platform.indexOf("Mac") == 0;
system.x11 = (platform.indexOf("X11") == 0) || (platform.indexOf("Linux") == 0);
比如我现在在chrome浏览器下打印如下：
console.log(system)
截图如下：
如果我想知道是win32或者是win64的话，我们可以使用这句代码打印即可
Console.log(navigator.platform);
识别移动设备
可以通过简单地检测字符串”iPhone”,”iPod”,”iPad”,就可以分别设置响应属性的值了。
system.iphone = ua.indexOf(“iphone”) > -1;
system.ipod = ua.indexOf(“ipod”) > -1;
system.ipad = ua.indexOf(“ipad”) > -1;
除了知道iOS 设备，最好还能知道iOS 的版本号。在iOS 3 之前，用户代理字符串中只包含”CPU like
Mac OS”，后来iPhone 中又改成”CPU iPhone OS 3_0 like Mac OS X”，iPad 中又改成”CPU OS 3_2
like Mac OS X”。也就是说，检测iOS 需要正则表达式反映这些变化。
//检测iOS 版本
if (system.mac && ua.indexOf("mobile") > -1){
if (/cpu (?:iphone )?os (\d+_\d+)/.test(ua)){
system.ios = parseFloat(RegExp.$1.replace("_", "."));
} else {
system.ios = 2;
//不能真正检测出来，所以只能猜测
}
}
检查系统是不是Mac OS、字符串中是否存在”Mobile”，可以保证无论是什么版本，system.ios
中都不会是0。然后，再使用正则表达式确定是否存在iOS 的版本号。如果有，将system.ios 设置为
表示版本号的浮点值；否则，将版本设置为2。（因为没有办法确定到底是什么版本，所以设置为更早的
版本比较稳妥。）
检测Android 操作系统也很简单，也就是搜索字符串”Android”并取得紧随其后的版本号。
//检测Android 版本
if (/android (\d+\.\d+)/.test(ua)){
system.android = parseFloat(RegExp.$1);
}
由于所有版本的Android 都有版本值，因此这个正则表达式可以精确地检测所有版本，并将
system.android 设置为正确的值。
在了解这些设备信息的基础上，就可以通过下列代码来确定用户使用的是什么设备中的WebKit 来
访问网页：
if (client.engine.webkit){
if (client.system.ios){
//iOS 手机的内容
} else if (client.system.android){
//Android 手机的内容
}
}
因此所有的JS代码如下：
var client = function(){
var engine = {
// 呈现引擎
ie: 0,
gecko:0,
webkit: 0,
khtml:0,
opera:0,
//其他版本号
ver: null
};
var browser = {
// 浏览器
ie: 0,
firefox:0,
safari:0,
konq:0,
opera:0,
chrome:0,
// 其他的版本
ver: null
};
var system = {
win: false,
mac: false,
xll: false,
// 移动设备
iphone: false,
ipod: false,
ipad: false,
ios: false,
android:false
};
// 在此检测呈现引擎，平台和设备
return {
engine: engine,
browser: browser,
system: system
};
}();
var engine = client;
var browser = client;
var ua = navigator.userAgent.toLowerCase();
if(ua.match(/opr\/([\d\.]+)/) || window.opera) {
var result = ua.match(/opr\/([\d\.]+)/);
engine.ver = browser.ver = result[1];
engine.opera = browser.opera = parseFloat(engine.ver);
if(window.opera) {
engine.ver = browser.ver = window.opera.version();
engine.opera = browser.opera = parseFloat(engine.ver);
}
}else if(/applewebkit\/(\S+)/.test(ua)) {
engine.ver = RegExp["$1"];
engine.webkit = parseFloat(engine.ver);
// 确定是chrome还是safari
/*
* chrome用户代理字符串
* Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko)
* Chrome/42.0.2311.152 Safari/537.36
*/
if(/chrome\/(\S+)/.test(ua)) {
browser.ver = RegExp["$1"];
browser.chrome = parseFloat(browser.ver);
}else if(/version\/(\S+)/.test(ua)) {
/*
* safari用户代理字符串
* Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/534.57.2 (KHTML, like Gecko)
* Version/5.1.7 Safari/534.57.2
*/
browser.ver = RegExp["$1"];
browser.safari = parseFloat(browser.ver);
}else {
//近似地确定版本号
var safariVersion = 1;
if (engine.webkit < 100){
safariVersion = 1;
} else if (engine.webkit < 312){
safariVersion = 1.2;
} else if (engine.webkit < 412){
safariVersion = 1.3;
} else {
safariVersion = 2;
}
browser.safari = browser.ver = safariVersion;
}
}else if (/khtml\/(\S+)/.test(ua) || /konqueror\/([^;]+)/.test(ua)){
engine.ver = browser.ver = RegExp["$1"];
engine.khtml = browser.konq = parseFloat(engine.ver);
}else if(/rv:([^\)]+)\) gecko\/\d{8}/.test(ua)){
engine.ver = RegExp["$1"];
engine.gecko = parseFloat(engine.ver);
/*
* firefox的用户代理的字符串
* Mozilla/5.0 (Windows NT 6.1; WOW64; rv:38.0)
* Gecko/20100101 Firefox/38.0
*/
// 确定是不是firefox
if(/firefox\/(\S+)/.test(ua)) {
browser.ver = RegExp["$1"];
browser.firefox = parseFloat(browser.ver);
}
}else if (/msie ([^;]+)/.test(ua) || "ActiveXObject" in window){
if("ActiveXObject" in window) {
if(/msie ([^;]+)/.test(ua)) {
engine.ver = browser.ver = RegExp["$1"];
engine.ie = browser.ie = parseFloat(engine.ver);
}else {
if(/rv:([^\)]+)\)/.test(ua)) {
engine.ver = browser.ver = RegExp["$1"];
engine.ie = browser.ie = parseFloat(engine.ver);
}
}
}
}
// 检测平台
var system = client;
var platform = navigator.platform;
system.win = platform.indexOf("Win") == 0;
system.mac = platform.indexOf("Mac") == 0;
system.x11 = (platform.indexOf("X11") == 0) || (platform.indexOf("Linux") == 0);
// 移动设备
system.iphone = ua.indexOf("iphone") > -1;
system.ipod = ua.indexOf("ipod") > -1;
system.ipad = ua.indexOf("ipad") > -1;
//检测iOS 版本
if (system.mac && ua.indexOf("mobile") > -1){
if (/cpu (?:iphone )?os (\d+_\d+)/.test(ua)){
system.ios = parseFloat(RegExp.$1.replace("_", "."));
} else {
system.ios = 2;
//不能真正检测出来，所以只能猜测
}
}
//检测Android 版本
if (/android (\d+\.\d+)/.test(ua)){
system.android = parseFloat(RegExp.$1);
}
来自：涂根华的博客
链接：http://www.cnblogs.com/tugenhua0707/p/4540766.html
|
