社會發展日新月異,科技也在飛速發展,上網終端中,移動設備異軍突起,以幾何形式在增長,對于從事于網站建設的技術人員來講,兼容不僅僅是PC上的瀏覽器,PC上的不同平臺問題,更多的要考慮移動設備例如:電話、平板電腦等,我們前面系統地介紹過如何使用javascript來識別不同的瀏覽器、Windows操作系統各個版本識別方法、識別不同平臺Window、Mac、Unix(Linux)方法,接下來由南昌網站設計公司技術人員向大家詳細介紹使用javascript識別移動設置的方法

2006到2007年,移動設備中Web瀏覽器的應用呈爆炸性增長。所有四大主要瀏覽器都推出了手機版和在其他設備中運行的版本。其中最流行的兩個平臺是iPhone和iPod Touch,相應的用戶代理字符串分別為：

Mozilla/5.0 (iPhone;U;CPU like Mac OS X;en) AppleWebKit/420+ (KHTML, like Gecko)

Version/3.O Mobile/IA543a Saf ari/419.3

Mozilla/5.0 (iPod;U;CPU like Mac OS X;en) AppleWebKit/420+ (KHTML, like Gecko)

Version/3.0 Mobile/IC28 Saf ari/419.3

從這兩個字符串來看,很明顯iPhone和iPod Touch都使用了Safari(WebKit)。盡管不是真正的Mac平臺,但為了保證通過平臺檢測,用戶代理字符串中包含著"CPU like Mac OS x"。有了兩個字符串,要檢測相應的設備就很簡單了。第一步是為要檢測的所有移動設備添加屬性,如下所示：

然后,通常簡單地檢測字符串"iPhone"和"iPod",就可以分別設置相應屬性的值了：

system.iphone=ua.indexOf("iPhone")>-l;

system.ipod=ua.indexOf("iPod")> -1;

system.macMobile= (system.iphone || system.ipod);

諾基亞N系列手機使用的也是WebKit,其用戶代理字符串與其他基于WebKit的手機很相似,例如：

Mozilla/5.O(SymbianOS/9.2; U;Series60/3.1 NokiaN95/11.0.026; Profile MIDP:2.O

Configuration/CLDC-1.1) AppleWebKit/413 (KHTML, like Gecko) Safari/413

雖然諾基亞N系列手機在用戶代理字符串中聲稱使用的是"Safari",但實際上并不是Safari,盡管確實是基于WebKit引擎。只要像下面檢測一下用戶代理字符串中是否存在"NokiaN",就足以確定是不是該系列的手機了：

system.nokiaN=ua.indexOf("NokiaN")>-1;

在了解這些設備信息的基礎上,就可以通過下列代碼來確定用戶使用的是什么設備中的WebKit來訪問網頁：

if ( client.engine.webkit){

if (client.system.macMobile){

//Mac手機的內容

} else if ( client.nokiaN){

//諾基亞手機的內容

}}

最后一種主要的移動設備平臺是Windows Mobile(也稱為Windows CE),用于Pocket PC和Smartphone中。由于從技術上說這些平臺都屬于Windows平臺,因此Windows平臺和操作系統都會返回正確的值。對于Windows Mobile 5.0及以前版本,這兩種設備的用戶代理字符串非常相似,如下

所示：

Mozilla/4.O (compatible; MSIE 4.01; Windows CE; PPC; 240x320)

Mozilla/4.O(compatible; MSIE 4.01; Windows CE; Smartphone; 17 6x220)

第一個來自Pocket PC中的移動Intemet Explorer4.01,第二個來自Smartphone中的同一個瀏覽器。當Windows操作系統檢測腳本檢測這兩個字符串時,system.win將被設置為"CE",因此在檢測

Windows Mobile時可以使用這個值：

system.winMobile= (system.win=="CE");

南昌網絡公司技術人員不建議測試字符串中的"PPC"或"Smartphone",因為在Windows Mobile 5.0以后版本的瀏覽器中,這些記號已經被移除了。不過,一般情況下,只知道某個設備使用的是Windows Mobile也就足夠了。

完整代碼如下:

var client = function(){

//rendering engines

var engine = {

ie: 0,

gecko: 0,

webkit: 0,

khtml: 0,

opera: 0,

//complete version

ver: null

};

//browsers

var browser = {

//browsers

ie: 0,

firefox: 0,

safari: 0,

konq: 0,

opera: 0,

chrome: 0,

//specific version

ver: null

};

//platform/device/OS

var system = {

win: false,

mac: false,

x11: false,

//mobile devices

iphone: false,

ipod: false,

ipad: false,

ios: false,

android: false,

nokiaN: false,

winMobile: false,

//game systems

wii: false,

ps: false

};

//detect rendering engines/browsers

var ua = navigator.userAgent;

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);

//figure out if it's Chrome or Safari

if (/Chrome/(S+)/.test(ua)){

browser.ver = RegExp["$1"];

browser.chrome = parseFloat(browser.ver);

} else if (/Version/(S+)/.test(ua)){

browser.ver = RegExp["$1"];

browser.safari = parseFloat(browser.ver);

} else {

//approximate version

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);

//determine if it's Firefox

if (/Firefox/(S+)/.test(ua)){

browser.ver = RegExp["$1"];

browser.firefox = parseFloat(browser.ver);

}

} else if (/MSIE ([^;]+)/.test(ua)){

engine.ver = browser.ver = RegExp["$1"];

engine.ie = browser.ie = parseFloat(engine.ver);

}

//detect browsers

browser.ie = engine.ie;

browser.opera = engine.opera;

//detect platform

var p = navigator.platform;

system.win = p.indexOf("Win") == 0;

system.mac = p.indexOf("Mac") == 0;

system.x11 = (p == "X11") || (p.indexOf("Linux") == 0);

//detect windows operating systems

if (system.win){

if (/Win(?:dows )?([^do]{2})s?(d+.d+)?/.test(ua)){

if (RegExp["$1"] == "NT"){

switch(RegExp["$2"]){

case "5.0":

system.win = "2000";

break;

case "5.1":

system.win = "XP";

break;

case "6.0":

system.win = "Vista";

break;

case "6.1":

system.win = "7";

break;

default:

system.win = "NT";

break;

}

} else if (RegExp["$1"] == "9x"){

system.win = "ME";

} else {

system.win = RegExp["$1"];

}

}

}

//mobile devices

system.iphone = ua.indexOf("iPhone") > -1;

system.ipod = ua.indexOf("iPod") > -1;

system.ipad = ua.indexOf("iPad") > -1;

system.nokiaN = ua.indexOf("NokiaN") > -1;

//windows mobile

if (system.win == "CE"){

system.winMobile = system.win;

} else if (system.win == "Ph"){

if(/Windows Phone OS (d+.d+)/.test(ua)){;

system.win = "Phone";

system.winMobile = parseFloat(RegExp["$1"]);

}

}

//determine iOS version

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; //can't really detect - so guess

}

}

//determine Android version

if (/Android (d+.d+)/.test(ua)){

system.android = parseFloat(RegExp.$1);

}

//gaming systems

system.wii = ua.indexOf("Wii") > -1;

system.ps = /playstation/i.test(ua);

//return it

return {

engine: engine,

browser: browser,

system: system

};

}();

本文僅限內部技術人員學習交流,不得作于其他商業用途.文章出自:南昌網站建設公司-百恒網絡 http://m.51yjwy.com 如轉載請注明出處!