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 相关文章推荐
Div Select挡住的解决办法
Aug 07 Javascript
Jquery提交表单 Form.js官方插件介绍
Mar 01 Javascript
js动态给table添加/删除tr的方法
Aug 02 Javascript
JS定时器实例详细分析
Oct 11 Javascript
jquery简单图片切换显示效果实现方法
Jan 14 Javascript
JQuery插件Marquee.js实现无缝滚动效果
Apr 26 Javascript
jQuery图片前后对比插件beforeAfter用法示例【附demo源码下载】
Sep 20 Javascript
Bootstrap modal使用及点击外部不消失的解决方法
Dec 13 Javascript
微信小程序登录态控制深入分析
Apr 12 Javascript
兼容浏览器的js事件绑定函数(详解)
May 09 Javascript
JavaScript通过filereader接口读取文件
May 10 Javascript
小程序视频列表中视频的播放与停止的示例代码
Jul 20 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
用 PHP5 轻松解析 XML
2006/12/04 PHP
Laravel 5 框架入门(四)完结篇
2015/04/09 PHP
php实现数组中索引关联数据转换成json对象的方法
2015/07/08 PHP
php中上传文件的的解决方案
2018/09/25 PHP
获取dom元素那些讨厌的位置封装代码
2010/06/23 Javascript
用js来解决ajax读取页面乱码
2010/11/28 Javascript
仿猪八戒网左下角的文字滚动效果
2011/10/28 Javascript
JS版的date函数(和PHP的date函数一样)
2014/05/12 Javascript
NodeJS Express框架中处理404页面一个方式
2014/05/28 NodeJs
jQuery密码强度检测插件passwordStrength用法实例分析
2015/10/30 Javascript
判断JS对象是否拥有某属性的方法推荐
2016/05/12 Javascript
Angular的MVC和作用域
2016/12/26 Javascript
JSON键值对序列化和反序列化解析
2017/01/24 Javascript
详解Vue路由自动注入实践
2019/04/17 Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
2019/09/12 Javascript
vue实现公告栏文字上下滚动效果的示例代码
2020/06/16 Javascript
vue-路由精讲 二级路由和三级路由的作用
2020/08/06 Javascript
Python教程之全局变量用法
2016/06/27 Python
Python 爬虫模拟登陆知乎
2016/09/23 Python
详解python-图像处理(映射变换)
2019/03/22 Python
Django框架视图函数设计示例
2019/07/29 Python
Python Opencv提取图片中某种颜色组成的图形的方法
2019/09/19 Python
Python 中pandas索引切片读取数据缺失数据处理问题
2019/10/09 Python
Django单元测试中Fixtures的使用方法
2020/02/26 Python
matplotlib之多边形选区(PolygonSelector)的使用
2021/02/24 Python
css3发光搜索表单分享
2014/04/11 HTML / CSS
利用HTML5实现使用按钮控制背景音乐开关
2015/09/21 HTML / CSS
爱尔兰灯和灯具网上商店:Lights.ie
2018/03/26 全球购物
英国领先的在线高尔夫商店:Scottsdale Golf
2019/08/26 全球购物
外包公司软件测试工程师
2014/11/01 面试题
业务主管岗位职责范本
2013/12/25 职场文书
安全资金保障制度
2014/01/23 职场文书
大学信息公开实施方案
2014/03/09 职场文书
故宫英文导游词
2015/01/31 职场文书
乡镇法制宣传日活动总结
2015/05/05 职场文书
MySQL 自定义变量的概念及特点
2021/05/13 MySQL