javascript 學習筆記（六）瀏覽器類型及版本信息檢測代碼

更新時間：2011年04月08日 00:30:01 作者：

由于各瀏覽器對css以及js支持的差異性，我們在做前端開發(fā)時，經(jīng)常需要先檢測瀏覽器的類型及版本，然后會對各自的差異性來寫代碼！

下面的checkBrowser()函數(shù)主要檢測了三種瀏覽器（IE, firefox, chrome），其它的瀏覽器的檢測有興趣的朋友可以自行添加檢測代碼！
HTML部分代碼： (頁面加載時執(zhí)行檢測函數(shù))

復制代碼代碼如下:

 
<body onload="checkBrowser()"> 
<p id="userAgent"></p> 
<p id="browser"></p> 
</body> 

javascript部分代碼：
檢測的原理主要根據(jù) 瀏覽器的用戶代理報頭nanigator.userAgent中提取到瀏覽器和類型及版本信息，利用正則表達式可以很容易的滿足我們的需求，如對正則表達式不熟悉，可參照此文（正則表達式）

復制代碼代碼如下:

 
function check(reg) { 
var ug = navigator.userAgent.toLowerCase(); 
return reg.test(ug); 
} 
function checkBrowser() { 
var ug = navigator.userAgent.toLowerCase(); 
var userAgent = document.getElementById("userAgent"); 
userAgent.innerHTML = "瀏覽器的用戶代理報頭：" + ug; 
var browserType = ""; 
var ver = ""; 
//檢測IE及版本 
var IE = ug.match(/msie\s*\d\.\d/); //提取瀏覽器類型及版本信息，注match()方法返回的是數(shù)組而不是字符串 
var isIE = check(/msie/); 
if(isIE) { 
browserType = "Internet Explorer"; 
ver = IE.join(" ").match(/[0-9]/g).join("."); //先用join()方法轉(zhuǎn)化為字符串，然后用match()方法匹配到版本信息，再用join()方法轉(zhuǎn)化為字符串 
} 
//檢測chrome及版本 
var chrome = ug.match(/chrome\/\d\.\d/gi); 
var isChrome = check(/chrome/); 
if(isChrome) { 
browserType = "Chrome"; 
ver = chrome.join(" ").match(/[0-9]/g).join("."); 
} 
//檢測firefox及版本 
var firefox = ug.match(/firefox\/\d\.\d/gi); 
var isFirefox = check(/firefox/); 
if(isFirefox) { 
browserType = "Firefox"; 
ver = firefox.join(" ").match(/[0-9]/g).join("."); 
} 
var browser = document.getElementById("browser"); 
browser.innerHTML = "您正在使用的瀏覽器為：" + browserType + "<span style='padding-left:15px;'>版本為：</span>" + ver; 
} 

PS:各瀏覽器的用戶代理信息如下：

IE:Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.3; BOIE9;ZHCN); 

firefox:Mozilla/5.0 (Windows NT 6.1; rv:2.0) Gecko/20100101 Firefox/4.0; 

chrome:Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.13 (KHTML, like Gecko) Chrome/9.0.597.98 Safari/534.13