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 相关文章推荐
文本框中,回车键触发事件的js代码[多浏览器兼容]
Jun 07 Javascript
JQuery的ajax获取数据后的处理总结(html,xml,json)
Jul 14 Javascript
JQuery插件Style定制化方法的分析与比较
May 03 Javascript
js实现双击图片放大单击缩小的方法
Feb 17 Javascript
JS实现鼠标箭头变成一个燃烧烛光效果的方法
Feb 28 Javascript
jquery实现的Accordion折叠面板效果代码
Sep 02 Javascript
jQuery实现的超简单点赞效果实例分析
Dec 31 Javascript
js实现的光标位置工具函数示例
Oct 03 Javascript
node.js中EJS 模板快速入门教程
May 08 Javascript
解决Vue+Electron下Vuex的Dispatch没有效果问题
May 20 Javascript
Vue 实现v-for循环的时候更改 class的样式名称
Jul 17 Javascript
在Vue 中实现循环渲染多个相同echarts图表
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
php 保留字列表
2012/10/04 PHP
浅析php与数据库代码开发规范
2013/08/08 PHP
php实现的CSS更新类实例
2014/09/22 PHP
2020最新版 PhpStudy V8.1版本下载安装使用详解
2020/10/30 PHP
用JavaScript 处理 URL 的两个函数代码
2007/08/13 Javascript
JS OOP包机制,类创建的方法定义
2009/11/02 Javascript
网页右键ie不支持event.preventDefault和event.returnValue (需要加window)
2013/02/22 Javascript
关于jquery中全局函数each使用介绍
2013/12/10 Javascript
js取float型小数点后两位数的方法
2014/01/18 Javascript
javascript向后台传送相同属性的参数即数组参数
2014/02/17 Javascript
JS中的hasOwnProperty()和isPrototypeOf()属性实例详解
2016/08/11 Javascript
js文件中直接alert()中文出来的是乱码的解决方法
2016/11/01 Javascript
JavaScript拖动层Div代码
2017/03/01 Javascript
create-react-app安装出错问题解决方法
2018/09/04 Javascript
Vuex的actions属性的具体使用
2019/04/14 Javascript
jquery ui 实现 tab标签功能示例【测试可用】
2019/07/25 jQuery
Vue中的transition封装组件的实现方法
2019/08/13 Javascript
jQuery Raty星级评分插件使用方法实例分析
2019/11/25 jQuery
JS实现移动端双指缩放和旋转方法
2019/12/13 Javascript
Javascript地址引用代码实例解析
2020/02/25 Javascript
node.js如何根据URL返回指定的图片详解
2020/10/21 Javascript
Python学习笔记之os模块使用总结
2014/11/03 Python
解析Mac OS下部署Pyhton的Django框架项目的过程
2016/05/03 Python
Python数据分析:手把手教你用Pandas生成可视化图表的教程
2018/12/15 Python
centos 安装Python3 及对应的pip教程详解
2019/06/28 Python
解决pycharm每次打开项目都需要配置解释器和安装库问题
2020/02/26 Python
Python基于httpx模块实现发送请求
2020/07/07 Python
Python实现一个优先级队列的方法
2020/07/31 Python
个人素质的自我评价分享
2013/12/16 职场文书
业务总经理岗位职责
2014/02/03 职场文书
物业管理毕业生的自我评价
2014/02/17 职场文书
家长建议怎么写
2014/05/15 职场文书
经管应届生求职信范文
2014/05/18 职场文书
付款承诺函范文
2015/01/21 职场文书
宝宝满月祝酒词
2015/08/10 职场文书
使用GO语言实现Mysql数据库CURD的简单示例
2021/08/07 Golang