JavaScript 获取浏览器名称与版本号的实现方法
作者:白露时间:2026-10-28 20:29:39浏览:616
本文介绍如何利用 JavaScript 的 navigator.userAgent 属性准确获取浏览器名称及版本号。通过正则表达式匹配不同浏览器的特征字符串,实现了对 IE、Firefox、Chrome、Safari 及 Opera 等主流浏览器的识别,并提供了判断特定浏览器版本的辅助代码。
JavaScript 获取浏览器名称与版本号的实现方法
在实际开发中,经常需要通过 JavaScript 获取当前访问者所使用的浏览器名称及其版本号。虽然网上常见的方法是使用 navigator.appName,但该属性返回的值通常只有“Microsoft Internet Explorer”或“Netscape”,这仅能用于粗略判断是否使用 IE 内核,无法区分具体的浏览器产品如 Firefox 或 Chrome。因此,我们需要一种更精确的方法来识别具体的浏览器类型和版本信息。
以下是具体的实现代码:
function BroswerUtil() {
}
BroswerUtil.prototype = {
getBrowserVersion: function () {
var agent = navigator.userAgent.toLowerCase();
var arr = [];
var Browser = "";
var Bversion = "";
var verinNum = "";
//IE
if (agent.indexOf("msie") > 0) {
var regStr_ie = /msie [\d.]+;/gi;
Browser = "IE";
Bversion = "" + agent.match(regStr_ie)
}
//firefox
else if (agent.indexOf("firefox") > 0) {
var regStr_ff = /firefox\/[\d.]+/gi;
Browser = "firefox";
Bversion = "" + agent.match(regStr_ff);
}
//Chrome
else if (agent.indexOf("chrome") > 0) {
var regStr_chrome = /chrome\/[\d.]+/gi;
Browser = "chrome";
Bversion = "" + agent.match(regStr_chrome);
}
//Safari
else if (agent.indexOf("safari") > 0 && agent.indexOf("chrome") < 0) {
var regStr_saf = /version\/[\d.]+/gi;
Browser = "safari";
Bversion = "" + agent.match(regStr_saf);
}
//Opera
else if (agent.indexOf("opera") >= 0) {
var regStr_opera = /version\/[\d.]+/gi;
Browser = "opera";
Bversion = "" + agent.match(regStr_opera);
} else {
var browser = navigator.appName;
if (browser == "Netscape") {
var version = agent.split(";");
var trim_Version = version[7].replace(/[ ]/g, "");
var rvStr = trim_Version.match(/[\d\.]/g).toString();
var rv = rvStr.replace(/[,]/g, "");
Bversion = rv;
Browser = "IE"
}
}
verinNum = (Bversion + "").replace(/[^0-9.]/ig, "");
arr.push(Browser);
arr.push(verinNum);
return arr;
},
WB: (function () {
var UserAgent = navigator.userAgent.toLowerCase();
alert(UserAgent)
return {
isIE6: /msie 6.0/.test(UserAgent), // IE6
isIE7: /msie 7.0/.test(UserAgent), // IE7
isIE8: /msie 8.0/.test(UserAgent), // IE8
isIE9: /msie 9.0/.test(UserAgent), // IE9
isIE10: /msie 10.0/.test(UserAgent), // IE10
isIE11: /msie 11.0/.test(UserAgent), // IE11
isLB: /lbbrowser/.test(UserAgent), // 猎豹浏览器
isUc: /ucweb/.test(UserAgent), // UC浏览器
is360: /360se/.test(UserAgent), // 360浏览器
isBaidu: /bidubrowser/.test(UserAgent), // 百度浏览器
isSougou: /metasr/.test(UserAgent), // 搜狗浏览器
isChrome: /chrome/.test(UserAgent.substr(-33, 6)), // Chrome浏览器
isFirefox: /firefox/.test(UserAgent), // 火狐浏览器
isOpera: /opera/.test(UserAgent), // Opera浏览器
isSafire: /safari/.test(UserAgent) && !/chrome/.test(UserAgent), // safire浏览器
isQQ:/qqbrowser/.test(UserAgent)//qq浏览器
};
})()
}以上本文的全部内容,希望小伙伴们能够喜欢。
作者最新文章
AOS.js 动画不触发怎么办?排查 DOM 加载与移动端兼容问题
2026-11-05 17:02:26
sigma.js 怎么实现节点点击、拖拽与悬停提示交互
2026-11-05 15:03:27
Matter.js 与 PixiJS/Three.js 集成:分离物理计算与渲染
2026-11-05 13:43:48
主流JS弹幕库选型指南:Danmaku.js等库的功能与体积对比
2026-11-05 09:28:19
JavaScript点击事件监听与交互效果实例
2026-11-05 09:10:19
