javascript 学习笔记(六)浏览器类型及版本信息检测代码


Posted in Javascript onApril 08, 2011

下面的checkBrowser()函数主要检测了三种浏览器(IE, firefox, chrome),其它的浏览器的检测有兴趣的朋友可以自行添加检测代码!
HTML部分代码: (页面加载时执行检测函数)

<body onload="checkBrowser()"> 
<p id="userAgent"></p> 
<p id="browser"></p> 
</body>

javascript部分代码:
检测的原理主要根据 浏览器的用户代理报头nanigator.userAgent中提取到浏览器和类型及版本信息,利用正则表达式可以很容易的满足我们的需求,如对正则表达式不熟悉,可参照此文(正则表达式)
function check(reg) { 
var ug = navigator.userAgent.toLowerCase(); 
return reg.test(ug); 
} 
function checkBrowser() { 
var ug = navigator.userAgent.toLowerCase(); 
var userAgent = document.getElementById("userAgent"); 
userAgent.innerHTML = "浏览器的用户代理报头:" + ug; 
var browserType = ""; 
var ver = ""; 
//检测IE及版本 
var IE = ug.match(/msie\s*\d\.\d/); //提取浏览器类型及版本信息,注match()方法返回的是数组而不是字符串 
var isIE = check(/msie/); 
if(isIE) { 
browserType = "Internet Explorer"; 
ver = IE.join(" ").match(/[0-9]/g).join("."); //先用join()方法转化为字符串,然后用match()方法匹配到版本信息,再用join()方法转化为字符串 
} 
//检测chrome及版本 
var chrome = ug.match(/chrome\/\d\.\d/gi); 
var isChrome = check(/chrome/); 
if(isChrome) { 
browserType = "Chrome"; 
ver = chrome.join(" ").match(/[0-9]/g).join("."); 
} 
//检测firefox及版本 
var firefox = ug.match(/firefox\/\d\.\d/gi); 
var isFirefox = check(/firefox/); 
if(isFirefox) { 
browserType = "Firefox"; 
ver = firefox.join(" ").match(/[0-9]/g).join("."); 
} 
var browser = document.getElementById("browser"); 
browser.innerHTML = "您正在使用的浏览器为:" + browserType + "<span style='padding-left:15px;'>版本为:</span>" + ver; 
}

PS:各浏览器的用户代理信息如下:
 
IE:Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; Trident/5.0; SLCC2; .NET CLR 2.0.50727; .NET CLR 3.5.30729; .NET CLR 3.0.30729; Media Center PC 6.0; InfoPath.3; BOIE9;ZHCN);
firefox:Mozilla/5.0 (Windows NT 6.1; rv:2.0) Gecko/20100101 Firefox/4.0;
chrome:Mozilla/5.0 (Windows; U; Windows NT 6.1; en-US) AppleWebKit/534.13 (KHTML, like Gecko) Chrome/9.0.597.98 Safari/534.13
Javascript 相关文章推荐
Javascript之文件操作
Mar 07 Javascript
『JavaScript』限制Input只能输入数字实现思路及代码
Apr 22 Javascript
浅析Node.js非对称加密方法
Jan 29 Javascript
解决Vue.js 2.0 有时双向绑定img src属性失败的问题
Mar 14 Javascript
详解redux异步操作实践
Aug 15 Javascript
详解小程序用户登录状态检查与更新实例
May 15 Javascript
Vue+Element UI+vue-quill-editor富文本编辑器及插入图片自定义
Aug 20 Javascript
Node.js操作MongoDB数据库实例分析
Jan 19 Javascript
jQuery 移除事件的方法
Jun 20 jQuery
Angular短信模板校验代码
Sep 23 Javascript
如何通过Proxy实现JSBridge模块化封装
Oct 22 Javascript
Node.js文本文件BOM头的去除方法
Nov 22 Javascript
javascript学习笔记(五)正则表达式
Apr 08 #Javascript
javascript学习笔记(三)显示当时时间的代码
Apr 08 #Javascript
javascript 学习笔记(一)DOM基本操作
Apr 08 #Javascript
jQuery 名称冲突的解决方法
Apr 08 #Javascript
js 事件处理函数间的Event物件是否全等
Apr 08 #Javascript
Javascript 八进制转义字符(8进制)
Apr 08 #Javascript
JavaScript中判断函数是new还是()调用的区别说明
Apr 07 #Javascript
You might like
php猜单词游戏
2015/09/29 PHP
Adnroid 微信内置浏览器清除缓存
2016/07/11 PHP
PHP-FPM和Nginx的通信机制详解
2019/02/01 PHP
获取body标签的两种方法
2011/10/13 Javascript
JS代码优化技巧之通俗版(减少js体积)
2011/12/23 Javascript
jQuery实现弹出窗口中切换登录与注册表单
2015/06/05 Javascript
JavaScript的Vue.js库入门学习教程
2016/05/23 Javascript
JavaScript获取当前url根目录(路径)
2016/06/17 Javascript
详解vue组件基础
2018/05/04 Javascript
vue登录页面cookie的使用及页面跳转代码
2019/07/10 Javascript
JS计算斐波拉切代码实例
2019/09/12 Javascript
微信小程序分享小程序码的生成(带参数)以及参数的获取
2020/03/25 Javascript
js加减乘除精确运算方法实例代码
2021/01/17 Javascript
详解如何利用Cython为Python代码加速
2018/01/27 Python
python如何读写csv数据
2018/03/21 Python
python引入不同文件夹下的自定义模块方法
2018/10/27 Python
对python中GUI,Label和Button的实例详解
2019/06/27 Python
Python为何不能用可变对象作为默认参数的值
2019/07/01 Python
Django 对象关系映射(ORM)源码详解
2019/08/06 Python
基于Python执行dos命令并获取输出的结果
2019/12/30 Python
pycharm内无法import已安装的模块问题解决
2020/02/12 Python
python json 递归打印所有json子节点信息的例子
2020/02/27 Python
Python如何实现感知器的逻辑电路
2020/12/25 Python
基于第一个PhoneGap(cordova)的应用详解
2013/05/03 HTML / CSS
会话Bean的种类
2013/11/07 面试题
统计每一学生的平均成绩
2014/06/06 面试题
西部世纪.net笔试题面试题
2014/04/03 面试题
C++程序员求职信
2014/05/07 职场文书
白血病捐款倡议书
2014/05/14 职场文书
施工安全承诺书
2014/05/22 职场文书
计算机科学技术自荐信
2014/06/12 职场文书
经典演讲稿开场白
2014/08/25 职场文书
先进事迹材料范文
2014/12/29 职场文书
幼儿园辞职信范文
2015/02/27 职场文书
八一建军节主持词
2015/07/01 职场文书
Promise面试题详解之控制并发
2021/05/14 面试题