Internet上充斥著各種操作系統(tǒng)和各種版本的瀏覽器，每種瀏覽器都有自己的BOM和獨有的特性。因此，保證頁面在所有瀏覽器上正常運行是非常重要的，或者至少可以正常退出，例如顯示一個消息建議用戶升級瀏覽器。 有兩種方法可以測試瀏覽器是否可以執(zhí)行代碼：特性檢測和瀏覽器嗅探。它們的最終目標類似，測試給定的瀏覽器是否執(zhí)行代碼，但它們用于不同的目的。
并非所有的瀏覽器都支持相同的特性，這里的特性是指對于javaScript開發(fā)人員而言可以在代碼中訪問和使用的特性。特性檢測是指檢測瀏覽器是否支持某個給定特性的過程，該方法是瀏覽器檢測的首選方法。使用該方法時，需要做少許的維護工作，所有實現(xiàn)（或不實現(xiàn)）特定特性的瀏覽器都使用這種方法來檢測代碼的執(zhí)行。
特性檢測的模式很簡單：首先檢查特性是否存在，如果存在，就使用該特性。因此，使用一個if語句即可實現(xiàn)，如下所示：
if(navigator.geolocation){ //user geolocation}這段代碼將navigator.geolocation用作if語句的條件。在不支持geolocation的瀏覽器中，navigator.geolocation為undefined，因此值為falsey。
盡管if語句的條件值應(yīng)被設(shè)為true或false,但Javascript可以將任何值當作true或false。我們稱這些值為truthy和falsey。它們并不是真正的布爾值，但用在條件語句中時，其結(jié)果就為true或false了。 以下值為falsey:
0 ”” (一個空字符串) null undefined [ ] (一個空數(shù)組) false 除了上面的值，其他值都為truthy。上面的這種方式令人困惑，也給代碼增加了歧義性。現(xiàn)在應(yīng)盡量避免使用truthy/falsey語句，而是選擇使用typeof運算符，如下所示：
if(typeof navigator.geolocation!="undefined"){ //use geolocation }typeof運算符返回一個說明值或?qū)ο箢愋偷淖址?/strong>在支持geolocation的瀏覽器中，類型為”object”，而在不支持geolocation其他瀏覽器中，類型則為”undefined”。
對于任何對象或值都可以使用typeof運算符。如下表給出了typeof可能返回的值：
| 語句 | 結(jié)果 |
|---|---|
| typeof() 1 | 數(shù)字number |
| typeof() “hello” | 字符串string |
| typeof() true | 布爾值boolean |
| typeof() [](或 任何數(shù)組) | 對象object |
| typeof() {}(或 任何對象) | 對象object |
| typeof() undefined | 未定義undefined |
| typeof() null | 對象object |
==
document.write(typeof 1+"<br>"); document.write(typeof "hello"+"<br>"); document.write(typeof true+"<br>"); document.write(typeof [1,2]+"<br>"); document.write(typeof undefined+"<br>"); document.write(typeof null+"<br>");輸出結(jié)果為： number string boolean object undefined object
特性檢測方法特別有用，使用該方法可以將支持或不支持特性的瀏覽器分離開來。瀏覽器制造商并非都很完美，有時他們發(fā)布的瀏覽器版本具有唯一且古怪的功能。這樣，就需要區(qū)分單個瀏覽器，使用特性檢測就可以很好地實現(xiàn)這一點。
在大多數(shù)情況下，首選使用特性檢測方法。瀏覽器嗅探方法具有許多缺陷，其中之一就是少數(shù)瀏覽器可能宣稱自己是某主流瀏覽器，其實并不是那種瀏覽器類型。另外一個問題是瀏覽器嗅探依賴于瀏覽器的userAgent字符串(user-agent string)，該字符串用于標識瀏覽器，且瀏覽器制造商可以在不同的版本之間進行大幅度的修改。僅擋針對其有古怪行為的單個瀏覽器時，才使用瀏覽器嗅探技術(shù)。 navigator對象的appName屬性和userAgent屬性在標識瀏覽器方面很有用。appName屬性將返回瀏覽器的模型，如對IE返回Microsoft Internet Explorer,對Firefox,Chrome和Safari返回Netscape。 userAgent屬性返回一個包含多段信息的字符串，如瀏覽器的版本，操作系統(tǒng)和瀏覽器模型。但是，這個屬性的返回值因瀏覽器而異。例如，瀏覽器的版本被嵌入在該字符串的不同位置。
例如在chrome獲取userAgent字符串： Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/54.0.2840.87 Safari/537.36
從這個字符串中可以得知使用的是windows10 64位操作系統(tǒng)，Chrome 54.0版本的瀏覽器。AppleWebKit好像是瀏覽器內(nèi)核。后續(xù)的操作獲取瀏覽器信息都是根據(jù)這個字符串來進行的。
例如:
<script> function getBrowserName(){ var browser=navigator.userAgent; if(browser.indexOf("MSIE")>=0){ return "MSIE"; }else if(browser.indexOf("Firefox")>=0){ return "Firefox"; }else if(browser.indexOf("Chrome")>=0){ return "Chrome"; }else if(browser.indexOf("Safari")>=0){ return "Safari"; }else if(browser.indexOf("Opera")>=0){ return "Opera"; }else{ return "UNKNOWN"; } } function getBrowerVersion() { var ua=navigator.userAgent; var browser=getBrowserName(); var findIndex=ua.indexOf(browser)+browser.length+1; var browserVersion=parseFloat(ua.substring(findIndex,findIndex+3)); return browserVersion; } var browserName=getBrowserName(); var browserVersion=getBrowerVersion(); document.write(browserName+" "+browserVersion); </script>在Chrome中輸出： Chrome 54 在Opear中輸出： Chrome 55 在Firefox中輸出： Firefox 50
通過使用indexOf來搜索檢測是否存在某些關(guān)鍵字，如MSIE或者Firefox，通常就可以確定瀏覽器的名稱。只需要觀察navifator.userAgent返回的字符串，查找瀏覽器名稱或者唯一標識瀏覽器的子串。在userAgent字符串中，瀏覽器的版本信息通常緊跟在瀏覽器名稱之后。有了瀏覽器的名稱和版本信息，就可以利用這些信息過濾用戶當前運行的瀏覽器，從而來檢測判斷該瀏覽器是否具有某種特性。 注意：除針對單個瀏覽器外，不能依賴于瀏覽器嗅探技術(shù)。
新聞熱點
疑難解答
