浏览器嗅探器【检测】

前端开发中经常会遇到一系列兼容性问题,怎样精准地识别出各个浏览器的版本是一件很头痛的问题。下面跟大家分享图个非常实用的浏览器嗅探器的插件,可以让我们在开发中针对各种浏览器作出不同的流程控制。实现浏览器兼容。

代码如下:

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",
			versionSearch: "Version"
		},
		{
			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();

使用如下

alert(BrowserDetect.browser); //浏览器名称
alert(BrowserDetect.version); //浏览器版本
alert(BrowserDetect.OS) //系统
时间: 2024-08-04 14:37:47

浏览器嗅探器【检测】的相关文章

浏览器嗅探器(转)

浏览器检测是在工作中经常用到的,如果只是简单判断当前是什么浏览器的话可以通过window.navigator.useragent这样的js来直接判断就可以了! 但是针对浏览器版本要求比较高的时候,如果只是单纯的判断浏览器的名字的话还不能解决问题,这时候就要通过其他方式来实现!现有的jquery已经废弃了$.browser的使用,所以在这里我介绍一个叫做"浏览器嗅探器"的程序来实现! 代码如下:(BrowserDetect.js) var BrowserDetect = { init:

Feature.js-轻量级浏览器特性检测JavaScript库插件

简要教程 Feature.js是一款轻量级的浏览器特性检测JavaScript库插件.该插件运行速度快,使用简单,文件只有1kb大小.通过Feature.js你可以检测客户浏览器是否支持某些特性,并针对这些特性编写代码. Feature.js会自动在页面初始化时进行加载,但是它不会自动进行特性检测,直到你在代码中调用它时才会进行指定特性的检测. 通过Feature.js你可以对浏览器进行特性检测,例如检测浏览器是否支持CSS 3D transforms,为支持该特性的浏览器编写代码来操纵元素进行

火狐浏览器firefox检测不到U盾证书

火狐浏览器firefox检测不到U盾证书 近来改用火狐浏览器上网,但想用网上银行支付的时候发现,火狐浏览器检测不到农行K宝U盾的证书,如何解决呢?今天就和大家分享分享这个办法. 第一步:打开火狐浏览器firefox,点击菜单上的"工具",再点选"附加组件" 第二步:在弹出的附加组件管理器中点击"获取附加组件"的选项卡. 第三步:在右边的窗口中将浏览器的滚动条拉到底部.并点击"浏览所有附加组件"如图所示. 第四步:在弹出的新页面

js+jquery检测用户浏览器型号(包括对360浏览器的检测)

做网站,js检测用户浏览器的版本,是经常要使用到,今天自己写了一个js,完成了对于一些常见浏览器的检测,但是,偏偏对于360浏览器的检测没有任 何办法,研究了一会儿,无果.无论是360安全浏览器,还是360极速浏览器,在极速模式下面,都只能检测到用户是使用的谷歌浏览器.后来在网上找了很 久,看了很多大神的帖子,结合了自己的想法,写出了下面的解决办法: 这是 BrowserCheck.html页面显示文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1

浏览器特性检测插件Feature.js

<script src="js/feature.js"></script> if (feature.webGL) { console.log("你的浏览器支持WebGL"); } else { console.log("你的浏览器不支持WebGL"); } 下面是Feature.js可进行的浏览器检测的特性列表. feature.async feature.addEventListener feature.canvas f

JavaScript笔记——BOM的操作和浏览器的检测

BOM的操作 BOM 也叫浏览器对象模型,它提供了很多对象,用于访问浏览器的功能.BOM 缺少规范,每个浏览器提供商又按照自己想法去扩展它,就可能存在浏览器不兼容的情况,那么浏览器共有对象就成了事实的标准. 所以,BOM 本身是没有标准的或者还没有哪个组织去标准它 window 对象 BOM 的核心对象是 window,它表示浏览器的一个实例.window 对象处于 JavaScript 结构的最顶层,对于每个打开的窗口,系统都会自动为其定义 window 对象 window的部分属性和方法 属

浏览器对象检测

<!doctype html> <html> <head> <meta charset="utf-8"> <title></title> <meta http-equiv="pragma" content="no-cache"> <meta http-equiv="pragma" content="no-cache"&

浏览器判断检测手机中是否安装了ios/android客户端程序

分类: iPhone 编程2013-08-26 10:38 1851人阅读 评论(2) 收藏 举报 最近在做一个项目,该项目的前身是为mobile browser量身打造的一个网站.现在有这样一个需求: 当用户在用mobile browser浏览该网站的时候会点击一个按钮/超链接,通过这个按钮的点击事情需要打开安装在本机的应用程序,或者如果本机没有安装该应用程序则打开应用商店并打开该程序在商店中的搜索结果页面. 刚开始的时候iPhone team的人给出一个solution,下面是实施跳转的HT

浏览器检测(BrowserDetect.js)

浏览器检测是在工作中经常用到的,如果只是简单判断当前是什么浏览器的话可以通过window.navigator.useragent这样的js来直接判断就可以了! 但是针对浏览器版本要求比较高的时候,如果只是单纯的判断浏览器的名字的话还不能解决问题,这时候就要通过其他方式来实现!现有的jquery已经废弃了$.browser的使用,所以在这里我介绍一个叫做"浏览器嗅探器"的程序来实现! 代码如下:(BrowserDetect.js) var BrowserDetect = { init: