浏览器检测是在工作中经常用到的,如果只是简单判断当前是什么浏览器的话可以通过window.navigator.useragent这样的js来直接判断就可以了!

但是针对浏览器版本要求比较高的时候,如果只是单纯的判断浏览器的名字的话还不能解决问题,这时候就要通过其他方式来实现!现有的jquery已经废弃了$.browser的使用,所以在这里我介绍一个叫做"浏览器嗅探器"的程序来实现!

代码如下:(BrowserDetect.js)

var BrowserDetect = {
init: function () {
this.browser = this.searchString(this.dataBrowser) || "An unknown browser";
this.version = this.searchVersion(navigator.userAgent)
|| this.searchVersion(navigator.appVersion)
|| "an unknown version";
this.OS = this.searchString(this.dataOS) || "an unknown OS";
},
searchString: function (data) {
for (var i=0;i<data.length;i++) {
var dataString = data[i].string;
var dataProp = data[i].prop;
this.versionSearchString = data[i].versionSearch || data[i].identity;
if (dataString) {
if (dataString.indexOf(data[i].subString) != -1)
return data[i].identity;
}
else if (dataProp)
return data[i].identity;
}
},
searchVersion: function (dataString) {
var index = dataString.indexOf(this.versionSearchString);
if (index == -1) return;
return parseFloat(dataString.substring(index+this.versionSearchString.length+1));
},
dataBrowser: [
{
string: navigator.userAgent,
subString: "Chrome",
identity: "Chrome"
},
{ string: navigator.userAgent,
subString: "OmniWeb",
versionSearch: "OmniWeb/",
identity: "OmniWeb"
},
{
string: navigator.vendor,
subString: "Apple",
identity: "Safari",
versionSearch: "Version"
},
{
prop: window.opera,
identity: "Opera"
},
{
string: navigator.vendor,
subString: "iCab",
identity: "iCab"
},
{
string: navigator.vendor,
subString: "KDE",
identity: "Konqueror"
},
{
string: navigator.userAgent,
subString: "Firefox",
identity: "Firefox"
},
{
string: navigator.vendor,
subString: "Camino",
identity: "Camino"
},
{ // for newer Netscapes (6+)
string: navigator.userAgent,
subString: "Netscape",
identity: "Netscape"
},
{
string: navigator.userAgent,
subString: "MSIE",
identity: "Internet Explorer",
versionSearch: "MSIE"
},
{
string: navigator.userAgent,
subString: "Gecko",
identity: "Mozilla",
versionSearch: "rv"
},
{ // for older Netscapes (4-)
string: navigator.userAgent,
subString: "Mozilla",
identity: "Netscape",
versionSearch: "Mozilla"
}
],
dataOS : [
{
string: navigator.platform,
subString: "Win",
identity: "Windows"
},
{
string: navigator.platform,
subString: "Mac",
identity: "Mac"
},
{
string: navigator.userAgent,
subString: "iPhone",
identity: "iPhone/iPod"
},
{
string: navigator.platform,
subString: "Linux",
identity: "Linux"
}
] };
BrowserDetect.init();

使用方式如下:

BrowserDetect.browser;// 浏览器的名称,例如Firefox,IE
BrowserDetect.version;//浏览器的版本,比如,7、11
BrowserDetect.OS;//浏览器所宿主的操作系统,比如Windows、Linux

这个js兼容非常不错!使用起来比较简单,而且功能强大!

浏览器检测(BrowserDetect.js)使用的更多相关文章

  1. 浏览器检测(BrowserDetect.js)

    浏览器检测是在工作中经常用到的,如果只是简单判断当前是什么浏览器的话可以通过window.navigator.useragent这样的js来直接判断就可以了! 但是针对浏览器版本要求比较高的时候,如果 ...

  2. 浏览器检测-js

    昨天有一同学问我为什么attachEvent在非IE浏览器下不能起作用,我也跟他解释了一番:attachEvent是IE下独有的,只能在IE下使用,其他浏览器下应该用addEventListener来 ...

  3. 浏览器检测navigator 对象

    1.浏览器及版本号不同的浏览器支持的功能.属性和方法各有不同.比如IE 和Firefox 显示的页面可能就会有所略微不同. alert('浏览器名称:' + navigator.appName); a ...

  4. 第一百一十二节,JavaScript浏览器检测

    JavaScript浏览器检测 学习要点: 1.navigator对象 2.客户端检测 由于每个浏览器都具有自己独到的扩展,所以在开发阶段来判断浏览器是一个非常重要的步骤.虽然浏览器开发商在公共接口方 ...

  5. JavaScript(第十七天)【浏览器检测】

    由于每个浏览器都具有自己独到的扩展,所以在开发阶段来判断浏览器是一个非常重要的步骤.虽然浏览器开发商在公共接口方面投入了很多精力,努力的去支持最常用的公共功能:但在现实中,浏览器之间的差异,以及不同浏 ...

  6. JavaScript浏览器检测之navigator 对象

    一.使用客户端检测的原因 由于每个浏览器都具有自己独到的扩展,所以在开发阶段来判断浏览器是一个非常重要的步骤. 虽然浏览器开发商在公共接口方面投入了很多精力,努力的去支持最常用的公共功能: 但在现实中 ...

  7. navigator.userAgent浏览器检测(前端基础系列)

    对于前端来说,浏览器检测已经不陌生了,在做一些页面是,需要针对不同的浏览器进行处理不同的逻辑,最简单的就是区分pc和移动端的浏览器,或是android 和ios下的浏览器. 一.浏览器检测的由来?  ...

  8. 浏览器兼容的JS写法总结

    一.元素查找问题 1. document.all[name]   (1)现有问题:Firefox不支持document.all[name]   (2)解决方法:使用getElementsByName( ...

  9. 编写浏览器和Node.js通用的JavaScript模块

    长期以来JavaScript语言本身不提供模块化的支持, ES6中终于给出了 from, import等关键字来进行模块化的代码组织. 但CommonJS.AMD等规范已经被广为使用,如果希望你的Ja ...

随机推荐

  1. SQL Server 数据库没有有效全部者的三种解决的方法

    问题:     开发的过程中,操作系统出了问题.决定重装系统.可是没有将SQL Server中的数据库文件分离出来,直接将系统格了.在新系统数据库中附加了数据库文件,一切还算正常.但当打开数据库关系图 ...

  2. spring与mybatis集成和事务控制

    一个. 基本介绍 本文将使用spring整合mybatis, 并加入事务管理, 以此为记, 方便以后查阅. 二. 样例 1. 代码结构图: 2. 建表语句: DROP DATABASE test; C ...

  3. wamp You don't have permission to access / on this server等问题的解决.

    原文:wamp You don't have permission to access / on this server等问题的解决. 安装完wamp之后,安装网上的教程设置虚拟路径,出现了问题,同样 ...

  4. Asp.Netserver控制发展Grid实现(一个)UI转让

    使用Asp.Net办Web开发时间,控制系统提供了,目的,有时很难达到理想的.然后,有几种方法来解决,例如,使用html+js形式,在所需界面的布局的前端,然后通过ajax和其他方式获得的数据.为了实 ...

  5. JAVA解决大数

    主题链接:CLICK HERE~ 有了Java求解大数变得如此简单,以后再也不用操心大数模板了.哦啦啦啦. import java.math.BigInteger; import java.math. ...

  6. Java中间MD5加密算法完整版

    携带Java软件开发过程.,因此Java中提供了自带的MessageDigest实现对文本的加密算法,以下是一个对文本进行加密的MD5加密工具类代码演示样例: package net.yuerwan. ...

  7. java数据结构系列——排列(2):有序阵列

    package Array; /** * 对数组排序.当添加到阵列保持有序数组元素: * @author wl * */ public class MyOrderArray { private lon ...

  8. 《学习opencv》笔记——矩阵和图像处理——cvAnd、cvAndS、cvAvg and cvAvgSdv

    矩阵和图像的操作 (1)cvAnd函数 其结构 void cvAnd( //将src1和src2按像素点取"位与运算" const CvArr* src1,//第一个矩阵 cons ...

  9. 基于注释配置bean和装饰bean

    1.组件扫描 Spring容器能够从classpath(类路径)下自动扫描.侦测和实例化具有特定注释的组件. 2.特定注释组件 –@Component: 基本注解, 标识了一个受 Spring 管理的 ...

  10. 使用 CodeIgniter 框架快速开发 PHP 应用(三)

    原文:使用 CodeIgniter 框架快速开发 PHP 应用(三) 分析网站结构既然我们已经安装 CI ,我们开始了解它如何工作.读者已经知道 CI 实现了MVC式样. 通过对目录和文件的内容进行分 ...