能力檢測
在編寫代碼之前先檢測特定瀏覽器的能力。例如,腳本在調用某個函數之前,可能要先檢測該函數首付存在。這種檢測方法將開發人員從考慮具體的瀏覽器類型和版本中解放出來,讓他們把注意力集中到相應的能力是否存在上。能力檢測無法精確地檢測特定的瀏覽器和版本。
怪癖檢測
怪癖實際上是瀏覽器實現中存在的bug,例如早期的webkit中就存在一個怪癖,即它會再for-in循環中返回被隱藏的屬性。怪癖檢測通常涉及到運行一段代碼,然后確定瀏覽器是否存在某個怪癖。由于怪癖檢測無法精確地檢測特定的瀏覽器和版本。
用戶代理檢測
通過檢測用戶代理字符串來識別瀏覽器。用戶代理字符串中包含大量與瀏覽器有關的信息,包括瀏覽器、平臺、操作系統及瀏覽器版本。用戶代理字符串有過一段相當長的發展歷史,在此期間,瀏覽器提供商視圖通過在用戶代理字符串總添加一些欺騙性信息,欺騙網站詳細自己的瀏覽器是另外一種瀏覽器。用戶代理檢測需要特殊的技巧,特別是要注意Opera會隱瞞其用戶代理字符串的情況。即便如此,通過用戶代理字符串仍然能夠檢測出瀏覽器所用的呈現引擎以及所在的平臺,包括移動設備和游戲系統。
在每一次HTTP請求過程中,用戶代理字符串是作為響應首部發送的,而且該字符串可以通過Javascript的navigator.userAgent屬性訪問。在服務器端,通過檢測用戶代理字符串來確定用戶使用的瀏覽器是一種常用而且廣為接受的做法。而在客戶端,用戶代理檢測一般被當作一種萬不得已的做法,其優先級排在能力檢測和怪癖檢測之后。
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 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); // 確定是Chrome還是Safari if (/Chrome//(/S+)/.test(ua)) { browser.ver = RegExp["$1"]; browser.chrome = parseFloat(engine.ver); } else if (/Version//(S+)/.test(ua)) { 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.kong = parseFloat(engine.ver); } else if (/rv:([^/)]+)/) Gecko///d{8}/.test(ua)){ engine.ver = RegExp["$1"]; engine.gecko = parseFloat(engine.ver); // 確定是不是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); } // 檢測瀏覽器 browser.ie = engine.ie; browser.opera = engine.opera; // 返回這些對象 return { engine:engine, browser: browser }}();console.log(client.engine);console.log(client.browser);
Tangram 檢測瀏覽器源碼
/** * 聲明baidu包 */var baidu = baidu || {version: "1-3-2"}; // meizz 20100513 將 guid 升級成 /x06baidu.guid = "$BAIDU$";//提出guid,防止修改window[undefined] 20100504 berg/** * meizz 2010/02/04 * 頂級域名 baidu 有可能被閉包劫持,而需要頁面級唯一信息時需要用到下面這個對象 */window[baidu.guid] = window[baidu.guid] || {};/** * 聲明baidu.browser包 */baidu.browser = baidu.browser || {};/** * 判斷是否為isGecko */baidu.browser.isGecko = /gecko/i.test(navigator.userAgent) && !/like gecko/i.test(navigator.userAgent);/** * 判斷是否為isWebkit */baidu.browser.isWebkit = /webkit/i.test(navigator.userAgent);/** * 判斷是否為標準模式 */baidu.browser.isStrict = document.compatMode == "CSS1Compat";/** * 判斷是否為safari瀏覽器 */if ((/(/d+/./d)(/./d)?/s+safari/i.test(navigator.userAgent) && !/chrome/i.test(navigator.userAgent))) { baidu.browser.safari = parseFloat(RegExp['/x241']);}/** * 判斷是否為opera瀏覽器 */if (/opera//(/d+/./d)/i.test(navigator.userAgent)) { baidu.browser.opera = parseFloat(RegExp['/x241']);}/** * 判斷是否為chrome瀏覽器 */if (/chrome//(/d+/./d)/i.test(navigator.userAgent)) { baidu.browser.chrome = parseFloat(RegExp['/x241']);}/** * 判斷是否為ie瀏覽器 */if (/msie (/d+/./d)/i.test(navigator.userAgent)) { baidu.ie = baidu.browser.ie = document.documentMode || parseFloat(RegExp['/x241']);}/** * 判斷是否為firefox瀏覽器 */if (/firefox//(/d+/./d)/i.test(navigator.userAgent)) { baidu.browser.firefox = parseFloat(RegExp['/x241']); // '/x241' 是八進制表示法 '/x24' 對應字符 '$' ,所以 '/x241' 等同于 '$1'}
新聞熱點
疑難解答