浏览器检测是在工作中经常用到的,如果只是简单判断当前是什么浏览器的话可以通过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. SQLSERVER复制表的方法

    1.复制表结构及数据     格式:select * into 新表名 from 要复制的表名     --例如:select * into temp from users 2.只复制表数据   格式 ...

  2. [Javascript] Introduce to Webpack

    To use webpack, first you need to run: npm install webpack 2. Create a webpack.config.js file: modul ...

  3. careercup-C和C++ 13.10

    13.10 用C编写一个my2DALLoc函数,可分配二维数组.将malloc函数的调用次数降到最少,并确保可通过arr[i][j]访问该内存. 解法: 这道题目最简单的方法就是先开一个数组来存储指向 ...

  4. Locally Weighted Regression

    简单回顾一下线性回归.我们使用了如下变量:\(x\)—输入变量/特征:\(y\)—目标变量:\((x,y)\)—单个训练样本:\(m\)—训练集中的样本数目:\(n\)—特征维度:\((x^{(i)} ...

  5. 阅读《RobHess的SIFT源码分析:综述》笔记

    今天总算是机缘巧合的找到了照样一篇纲要性质的文章. 如是能早一些找到就好了.不过“在你认为为时已晚的时候,其实还为时未晚”倒是也能聊以自慰,不过不能经常这样迷惑自己,毕竟我需要开始跑了! 就照着这个大 ...

  6. Azure Powershell 创建 Internal Load Balancer

    Select-AzureSubscription -SubscriptionName "订阅名称" $serviceName="云服务名称" $ilbName= ...

  7. 【itclx面向对象二】窥探itcl面向编程源码

    从上一篇博客看出,itcl的语法其实不难,但是有个缺点,编程习惯与当前类似C++常见的面向编程还是有些区别,并且在大型项目实施中这种方式很费劲. 于是有了itclx. 例如: 1.成员变量.成员方法调 ...

  8. otf字体转ttf字体

    可以使用Font creator进行转换字体. 绿色版下载链接 Font Creator(字体编辑软件下载)V9.0官方版 或者我的百度云:http://pan.baidu.com/s/1c1jjfm ...

  9. [记录] nicescroll 在bootstrap tabs中工作

    Operlapping Nicescroll scrolbars in Bootstrap tabs 因为我的tab是指定id的 <!-- Nav tabs --> <ul clas ...

  10. Android进阶——声波振幅显示

    最近博主想做一个app,中间有一个是录音的功能.于是博主想把UI做的好看一些,想仿照微信或者QQ语音输入时,能够随着声音的大小显示声波振幅.于是查找了一些资料,现在把这个功能的Demo分享给大家,以后 ...