如何使用JavaScript的userAgent属性判断浏览器类型

不言
Freigeben: 2019-01-12 14:01:46
Original
3894 Leute haben es durchsucht

判断浏览器的类型我们可以使用JavaScript中提供的Navigator对象的userAgent属性,它是唯一可以获取运行JavaScript 的浏览器类型和版本等信息的属性,使用简单方便,但是如果做出错误的浏览器判断顺序则容易出错,因此必须要小心。

如何使用JavaScript的userAgent属性判断浏览器类型

我们先来看一下userAgent属性的基本语法

window.navigator.userAgent;
Nach dem Login kopieren

通过这样就可以获得描述浏览器信息的“字符串”作为返回值。

重点是将信息作为字符串获取到最后!

因此,有必要使用诸如indexOf()之类的方法在字符信息中提取浏览器的类型和版本。

如何获取浏览器信息?

让我们创建一个实际获取浏览器类型的程序!

首先从userAgent属性获取浏览器信息开始。

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

方法①和平常一样使用userAgent属性,不过,②最后执行的是toLowerCase()。

实际上,获取的浏览器信息是大写和小写字母的混合字符串,因此基本上将它全部用小写或大写字母更容易判断。

因此,一般来说,我会用方法②写下来!

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

在这个例子中,使用了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('其他浏览器'); }
Nach dem Login kopieren

在此示例中,使用userAgent获取浏览器信息,并且indexOf()按顺序判断每个浏览器名称。

我们在开始时介绍了一点,但比较的顺序是很重要的!

实际上,当您使用userAgent属性检查Edge浏览器时,它包含字符“chrome”和“safari”。

此外,查看Chrome浏览器包含“safari”一词。

这样,有些情况下会包含与原始浏览器不同的名称,因此有必要首先比较要调查的浏览器。

基本上,至少让我们保证“Edge”→“Chrome”→“Safari”的顺序!

Das obige ist der detaillierte Inhalt von如何使用JavaScript的userAgent属性判断浏览器类型. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Neueste Artikel des Autors
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!