npm 包 browser-version-detection 使用教程-JavaScript中文网-JavaScript教程资源分享门户

在开发前端项目时，我们经常需要根据不同浏览器及其版本来做出不同的展示或行为，这就需要使用浏览器版本检测工具。而针对这一需求，npm 上有一个非常好用的包叫做 browser-version-detection，本文我们就来详细介绍其使用方法。

1. 安装

首先需要安装该 npm 包，可以在终端输入以下命令进行安装：

npm install browser-version-detection --save

2. 引入

在需要使用的文件中，先引入该包：

import browserVersionDetection from 'browser-version-detection';

3. 使用

使用时，我们可以调用该包提供的函数获取当前浏览器的名称和版本号，具体函数有以下三个：

getBrowserName：获取当前浏览器的名称，返回值为字符串。
getBrowserVersion：获取当前浏览器的版本号，返回值为字符串。
getBrowserInfo：获取当前浏览器的完整信息，包括名称和版本号，返回值为对象，示例：

const browserInfo = browserVersionDetection.getBrowserInfo();
console.log(browserInfo); // 输出当前浏览器的完整信息：{ name: 'chrome', version: '90.0.4430.85' }

4. 示例

以判断浏览器是否为IE为例，我们可以使用以下代码：

const browserInfo = browserVersionDetection.getBrowserInfo();
if (browserInfo.name === 'ie') {
  // 在IE浏览器中执行的代码
}

又如，在判断浏览器是否为iOS Safari并且版本大于8时，我们可以使用以下代码：

const browserInfo = browserVersionDetection.getBrowserInfo();
if (browserInfo.name === 'safari' && parseFloat(browserInfo.version) > 8 && navigator.userAgent.match(/.*OS\s([\d_]+) like Mac OS X/)) {
  // 在iOS Safari浏览器版本大于8时执行的代码
}

以上就是 browser-version-detection 的使用方法，可以帮助我们更好地针对不同浏览器做出不同的处理。

来源：JavaScript中文网，转载请注明来源 https://www.javascriptcn.com/post/6005730a81e8991b448e937e