JS中特性與UA檢測

php中世界最好的语言原創: 2018-06-04 10:52:003686瀏覽

這次帶給大家JS中特性與UA檢測，JS中特性與UA檢測的注意事項有哪些，下面就是實戰案例，一起來看一下。

最早的瀏覽器嗅探即使用者代理程式（user-agent）偵測，服務端（以及後來的客戶端）根據user-agent字串來決定瀏覽器的類型。在此期間，伺服器會完全根據user-agent字串封鎖某些特定的瀏覽器檢視網站內容。其中獲益最大的瀏覽器就是網景瀏覽器。不可否認，網景（在當時）是最強大的瀏覽器，以至於許多網站都認為只有網景瀏覽器才會正常展現他們的網頁。網景瀏覽器的user-agent字串是Mozilla/2.0 (Win95; I)。當IE首次發布，基本上就被迫沿用了網景瀏覽器user-agent字串的很大一部分，以此確保伺服器能夠為這款新的瀏覽器提供服務。因為絕大多數的用戶代理檢測的過程都是查找「Mozilla」字串和斜線之後的版本號，IE瀏覽器的user-agent字串設定成Mozilla/2.0 (compatible; MSIE 3.0; Windows 95)，是不是覺得很雞賊。 IE採用了這樣的用戶代理字串，這意味著每個瀏覽器類型檢測也會把這款新的瀏覽器識別為網景的Navigator瀏覽器。這也使得新生瀏覽器部分複製現有瀏覽器用戶代理字串成為了一種趨勢。 Chrome發行版的用戶代理字串包含了Safari的一部分，而Safari的用戶代理字串又相應包含了Firefox的一部分，Firefox又依次包含了Netscape（網景）用戶代理字串的一部分。

基於UA檢測是極其不可靠的，並且維護困難，UA可以偽造，一個聲明為Chrome的瀏覽器它可能是其他瀏覽器

每次有新的瀏覽器出現，或是已有的瀏覽器版本升級，原先基於UA檢測的程式碼都要更新，維護成本和出錯幾率極大

所以我建議你盡可能避免檢測UA，即使在不得不這樣做的情況下。

2.8.2 特性偵測

我們希望有一種更聰明的基於瀏覽器條件（進行偵測）的方法，於是一種叫特性偵測的技術變得流行起來。特性檢測的原理是為特定瀏覽器的特性進行測試，並且僅當特性存在時即可應用特性檢測，例如：

// 不好的写法if (navigator.userAgent.indexOf("MSIE 7") > -1) { }// 好的写法if (
document
.getElementById) {}

因為特性檢測不依賴所使用的瀏覽器，而僅依據特性是否存在，所以不一定需要新瀏覽器的支援。例如，在DOM早期的時候，並非所有瀏覽器都支援document.getElementById()，所以根據ID取得元素的程式碼看起來就有些冗餘。

// 好的写法// 仅为举例说明特性检测，现代浏览器都支持getElementByIdfunction getById (id) {  var el = null;  if (document.getElementById) { // DOM
    el = document.getElementById(id);
  } else if (document.all) { // IE
    el = document.all[id];
  } else if (document.layers) { // Netscape <= 4
    el = document.layers[id];
  }  return el;
}

這種方法同樣適用於當今最新的瀏覽器特性檢測，瀏覽器已經實驗性地實現了這些最新的特性，而規範還正在最後確定中。常見的Polyfill就是特性偵測的應用，例如：

if (!Array.isArray) {  Array.isArray = function (arr) {    return 
Object
.prototype.toString.call(arr) === &#39;[object Array]&#39;
  }
}

相信看了本文案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！