JS对不同浏览器的检测问题

冷月秋风尚

于 2024-09-28 07:48:15 发布

阅读量417

点赞数 17

文章标签： javascript chrome 前端

本文链接：https://blog.csdn.net/m0_74157361/article/details/142609149

版权

Navigator对象也称浏览器对象，该对象包含了浏览器的整体信息，如浏览器名称，版本号等。Navigator对象由Navigator浏览器率先使用，后来各方浏览器都开始支持Navigator对象，逐步成为一种标准。

一、Navigator对象的属性

以大多数浏览器都支持的版本为例，其属性有如下：

属性	说明
appName	返回浏览器的名称
appVersion	返回浏览器的版本号
userAgent	返回浏览器用于HTTP请求的用户代理头的值
appCodeName	返回浏览器的代码名
platform	返回运行浏览器的操作系统或硬件平台

例如，使用Navigator对象将浏览器的名称和版本号等打印出来。

<html>

<head>

<title>无标题文档</title>

</head>

<!-- Begin

function whatBrowser() {

document.Browser.Name.value=navigator.appName;

document.Browser.Version.value=navigator.appVersion;

document.Browser.Code.value=navigator.appCodeName;

document.Browser.Agent.value=navigator.userAgent;

}

</SCRIPT>

你的浏览器名称: <INPUT TYPE="txt" NAME="Name" Size="45"><br />

你的浏览器信息: <INPUT TYPE="txt" NAME="Version" Size="45"><br />

你的浏览器密码信息:<INPUT TYPE="txt" NAME="Code" Size="45"><br />

使用信息: <INPUT TYPE="txt" NAME="Agent" Size="45"><br />

</FORM>

</body>

</html>

运行后，显示的结果为：

二、浏览器对象的子对象

Navigator对象的mimeTypes属性返回的是包含mimeType对象的数组，plugins属性返回的是包含Plugin对象的数组。因此，mimeType对象和Plugin对象是Navigator对象的子对象。

(一) mimeType对象

mimeType对象所代表的浏览器支持MIME类型数据格式，如属性如下：

属性	说明
description	返回对mimeType对象描述
enabledPlugin	返回一个数组，数组中的元素为Plugincf对象，该数组用于那些有插件支持的数据格式，如果没有，则返回null
suffixes	返回MIME类型文件的扩展名，如果有多个扩展名，则用逗号隔开
type	返回MIME类型的名称，该名称是唯一个可以用来描述当前MIME类型的字符串

由于Navigator对象的mimeTypes属性返回值是一个数组，因此，可以使用以下代码得到mimeType对象。

navigator.mimeTypes[i]

navigator.mimeTypes[“typename”]

(二)Plugin对象

Plugin对象用来描述浏览器所安装的插件，可以通过如下语句来获得：

navigator.plugins[i]

navigator. plugins[“typename”]

Plugin对象的属性如下：

属性	说明
description	插件的说明，由插件的创建者提供，用于说明插件的功能、厂商信息和版本信息等
filename	插件程序的文件名，不同的操作系统下，文件可能不同
length	插件所支持的MIME数组格式的个数，即该插件支持多少种数据格式
name	插件的名称

三、检测浏览器是否支持某些特性

要检测某些函数和属性在当前浏览器上是否存在，最简单的方法是使用typeof操作符。

例如，检测当前浏览器是否支持XMLHttpRequest类，代码如下：

var xmiExiests=typeof XMLHttpRequest;

如果返回的是undefined，则表示当前浏览器不支持XMLHttpRequest类。

四、检测当前浏览器是处于标准模式还是Qurks模式

通过读取document.compatMode属性，可以确定浏览器在处理文档时使用的是标准模式还是Quirks模式，可以用以下代码进行检测。

function QuirksMode(){

if(typeof document.compatMode!=”undefined” && CSS.Compat/.text(doucment.compatMode)){

}

return true;

}

如果文档使用Quirks模式渲染的，那么将返回True，否则将返回false。至于使用哪种模式，也会在DOCTYPE声明中体现出来，没有DOCTYPE的HTML文档，将自动按照Quirks模式进行处理。但是，有DOCTYPE声明并不意味着文档一定按Quirks模式渲染，它还与CSS规则有关，因此需要在CSS进行适当的处理。