使用JavaScript中userAgent屬性判斷瀏覽器類型的方法

使用JavaScript中userAgent屬性判斷瀏覽器類型的方法？這個問題可能是我們日常學習或工作經常見到的。希望通過這個問題能讓你收獲頗深。下面是小編給大家帶來的參考內容，讓我們一起來看看吧！

判斷瀏覽器的類型我們可以使用JavaScript中提供的Navigator對象的userAgent屬性，它是唯一可以獲取運行JavaScript 的瀏覽器類型和版本等信息的屬性，使用簡單方便，但是如果做出錯誤的瀏覽器判斷順序則容易出錯，因此必須要小心。

我們先來看一下userAgent屬性的基本語法

window.navigator.userAgent;

通過這樣就可以獲得描述瀏覽器信息的“字符串”作為返回值。

重點是將信息作為字符串獲取到最后！

因此，有必要使用諸如indexOf()之類的方法在字符信息中提取瀏覽器的類型和版本。

如何獲取瀏覽器信息？

讓我們創建一個實際獲取瀏覽器類型的程序！

首先從userAgent屬性獲取瀏覽器信息開始。

//方法①
var agent = window.navigator.userAgent;
//方法②
var agent = window.navigator.userAgent.toLowerCase();

方法①和平常一樣使用userAgent屬性,不過，②最后執行的是toLowerCase()。

實際上，獲取的瀏覽器信息是大寫和小寫字母的混合字符串，因此基本上將它全部用小寫或大寫字母更容易判斷。

因此，一般來說，我會用方法②寫下來！

var agent = window.navigator.userAgent.toLowerCase();
var result = agent.indexOf('chrome') > -1;
console.log(result);

在這個例子中，使用了indexOf()確認取得了瀏覽器信息「chrome」的文字是否存在。

如果沒有，則返回“-1”，如果存在，則返回“字符位置”。

因此，通過“> -1”的比較，可以得到“true / false”，所以可以進行判定。

瀏覽器的判斷

目前，有各種瀏覽器，例如“IE”，“Chrome”，“Safari”，“Firefox”為主流瀏覽器

讓我們看看如何判斷每個瀏覽器！

一般來說，基本上是通過IF語句按順序判斷每個瀏覽器名稱。

var agent = window.navigator.userAgent.toLowerCase();
if(agent.indexOf('msie') > -1) { 
  console.log('IE瀏覽器'); 
} else if(agent.indexOf('edge') > -1) { 
  console.log('Edge瀏覽器');
} else if(agent.indexOf('chrome') > -1) {
  console.log('Chrome瀏覽器');
} else if(agent.indexOf('safari') > -1) {
  console.log('Safari瀏覽器');
} else if(agent.indexOf('firefox') > -1) {
  console.log('Firefox瀏覽器');
} else {
  console.log('其他瀏覽器');
}

在此示例中，使用userAgent獲取瀏覽器信息，并且indexOf()按順序判斷每個瀏覽器名稱。

我們在開始時介紹了一點，但比較的順序是很重要的！

實際上，當您使用userAgent屬性檢查Edge瀏覽器時，它包含字符“chrome”和“safari”。

此外，查看Chrome瀏覽器包含“safari”一詞。

這樣，有些情況下會包含與原始瀏覽器不同的名稱，因此有必要首先比較要調查的瀏覽器。

基本上，至少讓我們保證“Edge”→“Chrome”→“Safari”的順序！

感謝各位的閱讀！看完上述內容，你們對使用JavaScript中userAgent屬性判斷瀏覽器類型的方法大概了解了嗎？希望文章內容對大家有所幫助。如果想了解更多相關文章內容，歡迎關注億速云行業資訊頻道。