javascript 检测浏览器类型和版本的代码


Posted in Javascript onSeptember 15, 2009

检测浏览器及其版本的代码

getBrowser : function(){ 
var browser = { 
msie: false, firefox: false, opera: false, safari: false, 
chrome: false, netscape: false, appname: 'unknown', version: 0 
}, 
userAgent = window.navigator.userAgent.toLowerCase(); 
if ( /(msie|firefox|opera|chrome|netscape)\D+(\d[\d.]*)/.test( userAgent ) ){ 
browser[RegExp.$1] = true; 
browser.appname = RegExp.$1; 
browser.version = RegExp.$2; 
} else if ( /version\D+(\d[\d.]*).*safari/.test( userAgent ) ){ // safari 
browser.safari = true; 
browser.appname = 'safari'; 
browser.version = RegExp.$2; 
} 
return browser.appname + browser.version; 
}

对象/特征检测法

该方法是一种判断浏览器能力(而非浏览器的确切型号)的通用方法。大部分JS专家认为这个方法最合适,因为他们认为按照该方法所编写的脚本是经得起未来考验的。

//获取IE浏览器的版本号
//返回数值,显示IE的主版本号
function getIEVer() {
var ua = navigator.userAgent; //获取用户端信息
var b = ua.indexOf("MSIE "); //检测特殊字符串"MSIE "的位置
if (b < 0) {
return 0;
}
return parseFloat(ua.substring(b + 5, ua.indexOf(";", b))); //截取版本号字符串,并转换为数值
}

alert(getIEVer()); //返回数值8(我的IE8)

如果更关注浏览器的能力而不在乎它实际的身份,就可以使用这种方法。

user-agent字符串检测法

user-agent字符串提供了关于Web浏览器的大量信息,包括浏览器的名称和版本。

var ua = navigator.userAgent.toLowerCase(); //获取用户端信息
var info = {
ie: /msie/.test(ua) && !/opera/.test(ua),  //匹配IE浏览器
op: /opera/.test(ua),  //匹配Opera浏览器
sa: /version.*safari/.test(ua),  //匹配Safari浏览器
ch: /chrome/.test(ua),  //匹配Chrome浏览器
ff: /gecko/.test(ua) && !/webkit/.test(ua)  //匹配Firefox浏览器
};
(info.ie) && alert("IE浏览器");
(info.op) && alert("Opera浏览器");
(info.sa) && alert("Safari浏览器");
(info.ff) && alert("Firefox浏览器");
(info.ch) && alert("Chrome浏览器");

通常我们做得最多的,就是判断是否是IE了,其它几种浏览器一般都会符合标准.有些客户只需要符合IE和FF就已经满足了.那么我们可以这样做:

var isIE = (navigator.appName == "Microsoft Internet Explorer");

判断IE远远不止上面一种方法,可以使用IE更多特有的东西,如:window.ActiveXObject,document.all等,这些都属于对象/特征检测法了!通常要在不同的浏览器上写不同的样式(因为IE样式解析也各有不同),那就得判断版本了.可以这样做

//获取IE浏览器的版本号
//返回数值,显示IE的主版本号
function getIEVer() {
var ua = navigator.userAgent; //获取用户端信息
var b = ua.indexOf("MSIE "); //检测特殊字符串"MSIE "的位置
if (b < 0) {
return 0;
}
return parseFloat(ua.substring(b + 5, ua.indexOf(";", b))); //截取版本号字符串,并转换为数值
}

alert(getIEVer()); //返回数值7

检测操作系统:

var isWin = (navigator.userAgent.indexOf("Win") != -1); //如果是Windows系统,则返回true
var isMac = (navigator.userAgent.indexOf("Mac") != -1);  //如果是Macintosh系统,则返回true
var isUnix = (navigator.userAgent.indexOf("X11") != -1);  //如果是Unix系统,则返回true
var isLinux = (navigator.userAgent.indexOf("Linux") != -1);  //如果是Linux系统,则返回true

文章大部分内容来自于《Javascript征途》

Javascript 相关文章推荐
推荐:极酷右键菜单
Nov 29 Javascript
使用自定义setTimeout和setInterval使之可以传递参数和对象参数
Apr 24 Javascript
node.js下LDAP查询实例分享
Sep 30 Javascript
jQuery代码实现表格中点击相应行变色功能
May 09 Javascript
基于Vue2的移动端开发环境搭建详解
Nov 03 Javascript
Vue生命周期示例详解
Apr 12 Javascript
开发一个Parcel-vue脚手架工具(详细步骤)
Sep 22 Javascript
使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)
Oct 23 Javascript
微信小程序调用天气接口并且渲染在页面过程详解
Jun 24 Javascript
Vue CLI4 Vue.config.js标准配置(最全注释)
Jun 05 Javascript
React实现评论的添加和删除
Oct 20 Javascript
vue项目查看vue版本及cli版本的实现方式
Oct 24 Javascript
不安全的常用的js写法
Sep 15 #Javascript
Mootools 1.2教程 滑动效果(Slide)
Sep 15 #Javascript
Mootools 1.2教程 同时进行多个形变动画
Sep 15 #Javascript
Mootools 1.2教程(21)——类(二)
Sep 15 #Javascript
Mootools 1.2教程 选项卡效果(Tabs)
Sep 15 #Javascript
Mootools 1.2教程 Tooltips
Sep 15 #Javascript
Mootools 1.2教程 类(一)
Sep 15 #Javascript
You might like
[原创]PHP中通过ADODB库实现调用Access数据库之修正版本
2006/12/31 PHP
php文件扩展名判断及获取文件扩展名的N种方法
2015/09/12 PHP
php封装的验证码工具类完整实例
2016/10/19 PHP
PHP二维索引数组的遍历实例分析【2种方式】
2019/06/24 PHP
学习ExtJS Panel常用方法
2009/10/07 Javascript
suggestion开发小结以及对键盘事件的总结(针对中文输入法状态)
2011/12/20 Javascript
原生js实现shift/ctrl/alt按键的获取
2013/04/08 Javascript
jQuery javaScript捕获回车事件(示例代码)
2013/11/07 Javascript
js全屏显示显示代码的三种方法
2013/11/11 Javascript
node.js中的path.isAbsolute方法使用说明
2014/12/08 Javascript
jQuery实现类似淘宝网图片放大效果的方法
2015/07/08 Javascript
jQuery插件EasyUI实现Layout框架页面中弹出窗体到最顶层效果(穿越iframe)
2016/08/05 Javascript
Bootstrap和Angularjs配合自制弹框的实例代码
2016/08/24 Javascript
原生javascript移动端滑动banner效果
2017/03/10 Javascript
jQuery实现的简单在线计算器功能
2017/05/11 jQuery
AngularJS实现表格的增删改查(仅限前端)
2017/07/04 Javascript
二维码图片生成器QRCode.js简单介绍
2017/08/18 Javascript
React教程之Props验证的具体用法(Props Validation)
2017/09/04 Javascript
详解webpack + react + react-router 如何实现懒加载
2017/11/20 Javascript
js中Array对象的常用遍历方法详解
2019/01/17 Javascript
[13:25]VP vs VICI (BO3)
2018/06/07 DOTA
从DataFrame中提取出Series或DataFrame对象的方法
2018/11/10 Python
Python3获取电脑IP、主机名、Mac地址的方法示例
2019/04/11 Python
Python中的十大图像处理工具(小结)
2019/06/10 Python
Python发展史及网络爬虫
2019/06/19 Python
基于 Django 的手机管理系统实现过程详解
2019/08/16 Python
使用TensorBoard进行超参数优化的实现
2020/07/06 Python
python request 模块详细介绍
2020/11/10 Python
Python3 + Appium + 安卓模拟器实现APP自动化测试并生成测试报告
2021/01/27 Python
纯CSS3实现鼠标滑过按钮动画第二节
2020/07/16 HTML / CSS
如何在存储过程中使用Loop
2016/01/05 面试题
中文专业求职信
2014/06/20 职场文书
十二月早安励志心语大全
2019/12/03 职场文书
pytorch 两个GPU同时训练的解决方案
2021/06/01 Python
vue router 动态路由清除方式
2022/05/25 Vue.js
如何让你的Nginx支持分布式追踪详解
2022/07/07 Servers