JavaScript 判断浏览器类型及版本

JavaScript 判断浏览器类型及版本是前端开发中的一个常见需求,下面为大家介绍一下如何进行判断。

JavaScript 判断浏览器类型及版本是前端开发中的一个常见需求,下面为大家介绍一下如何进行判断。

获取userAgent字符串

在判断浏览器类型和版本之前,我们需要先获取浏览器的userAgent字符串。这可以通过JavaScript里的navigator对象来实现:

var ua = navigator.userAgent.toLowerCase();

判断浏览器类型

获取到浏览器的userAgent字符串后,就可以根据不同的字符特征来判断浏览器类型了。以下是判断主要浏览器的示例代码:

判断Chrome浏览器

if (/chrome/i.test(ua) && /webkit/i.test(ua) && /mozilla/i.test(ua)) {
    console.log("This is Chrome browser");
}

判断Firefox浏览器

if (/firefox/i.test(ua) && /mozilla/i.test(ua)) {
    console.log("This is Firefox browser");
}

判断Safari浏览器

if (/safari/i.test(ua) && /applewebkit/i.test(ua)) {
    console.log("This is Safari browser");
}

判断IE浏览器

if (/msie|trident/i.test(ua)) {
    console.log("This is IE browser");
}

判断Edge浏览器

if (/edge/i.test(ua)) {
    console.log("This is Edge browser");
}

判断浏览器版本

除了判断浏览器类型之外,还有时候需要根据不同版本的浏览器来做出不同的处理。以下是判断一些主要浏览器版本的示例代码:

获取Chrome浏览器版本

var chromeVersion = ua.match(/chrome\/([\d.]+)/) && ua.match(/chrome\/([\d.]+)/)[1];
console.log("Chrome version is: " + chromeVersion);

获取Firefox浏览器版本

var firefoxVersion = ua.match(/firefox\/([\d.]+)/) && ua.match(/firefox\/([\d.]+)/)[1];
console.log("Firefox version is: " + firefoxVersion);

获取Safari浏览器版本

var safariVersion = ua.match(/version\/([\d.]+)/) && ua.match(/version\/([\d.]+)/)[1];
console.log("Safari version is: " + safariVersion);

获取IE浏览器版本

if (/msie (\d+\.\d+)/i.test(ua)) {
    var ieVersion = parseFloat(RegExp.$1);
    console.log("IE version is: " + ieVersion);
}

获取Edge浏览器版本

if (/edge\/([\d.]+)/i.test(ua)) {
    var edgeVersion = parseFloat(RegExp.$1);
    console.log("Edge version is: " + edgeVersion);
}

以上就是 JavaScript 判断浏览器类型及版本的完整攻略,希望能对大家有所帮助。

本文标题为:JavaScript 判断浏览器类型及版本

基础教程推荐