js 判断浏览器类型和版本

在JavaScript中，判断浏览器类型和版本通常涉及到对navigator.userAgent属性的解析。这个属性返回一个字符串，包含了浏览器的信息，开发者可以通过这个字符串来识别用户使用的浏览器及其版本。

基础概念

navigator.userAgent是一个字符串，它包含了浏览器的名称、版本号以及操作系统等信息。例如，Chrome浏览器的userAgent可能看起来像这样：

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/91.0.4472.124 Safari/537.36

类型与应用场景

类型：常见的浏览器类型包括Chrome、Firefox、Safari、Edge等。
应用场景：在开发响应式网站或Web应用时，需要根据不同的浏览器特性来调整页面布局或功能实现。

示例代码

以下是一个简单的JavaScript函数，用于检测浏览器类型和版本：

function detectBrowser() {
    var userAgent = navigator.userAgent;
    var browserName = "Unknown";
    var browserVersion = "Unknown";

    if (userAgent.indexOf("Firefox") > -1) {
        browserName = "Mozilla Firefox";
        browserVersion = userAgent.substring(userAgent.indexOf("Firefox") + 8);
    } else if (userAgent.indexOf("SamsungBrowser") > -1) {
        // 三星浏览器
        browserName = "Samsung Internet";
        browserVersion = userAgent.substring(userAgent.indexOf("SamsungBrowser") + 14);
    } else if (userAgent.indexOf("Opera") > -1 || userAgent.indexOf("OPR") > -1) {
        // Opera 8.0+
        browserName = "Opera";
        if (userAgent.indexOf("OPR") > -1) {
            browserVersion = userAgent.substring(userAgent.indexOf("OPR") + 4);
        } else {
            browserVersion = userAgent.substring(userAgent.indexOf("Opera") + 6);
        }
    } else if (userAgent.indexOf("Trident") > -1) {
        // IE 11
        browserName = "Microsoft Internet Explorer";
        browserVersion = userAgent.substring(userAgent.indexOf("rv") + 3);
    } else if (userAgent.indexOf("Edge") > -1) {
        // Edge (IE 12+)
        browserName = "Microsoft Edge";
        browserVersion = userAgent.substring(userAgent.indexOf("Edge") + 5);
    } else if (userAgent.indexOf("Chrome") > -1) {
        browserName = "Google Chrome";
        browserVersion = userAgent.substring(userAgent.indexOf("Chrome") + 7).split(" ")[0];
    } else if (userAgent.indexOf("Safari") > -1) {
        browserName = "Apple Safari";
        browserVersion = userAgent.substring(userAgent.indexOf("Version") + 8).split(" ")[0];
    }

    return {
        name: browserName,
        version: browserVersion
    };
}

var browser = detectBrowser();
console.log(browser.name + " " + browser.version);