很是全面的浏览器useragent判断代码

什么是User Agent？懂一点网页制做的人应该都明白。简单的说，User Agent就是用来识别浏览器名称、版本、引擎以及操做系统等信息的内容。因而乎，User Agent的判断就成为识别浏览器的关键，不单单如此，移动互联网开发势头迅猛，那么经过User Agent判断桌面端设备或移动设备就变的很为重要。固然，经过User Agent也能够用来改善必定的兼容性，好比判断获得用户用IE6浏览器那么就是用不一样的代码。这些，我想许多的WEB开发中已经成为考虑的第一个问题。javascript

那么，有没有一种好的判断User Agent的代码呢？网上应该有不少，比较简单的直接判断下iOS和Android，而后进入不同的页面。好比百度地图就是如此，桌面设备访问http://map.baidu.com/地址，而移动设备就访问http://map.baidu.com/mobile/地址，你用桌面设备访问移动网址则还会自动跳回到桌面地址。这就是经过判断User Agent作到的效果。html

我没有去细究百度地图是如何判断桌面设备和移动设备的，但我想要找到一个比较全面的User Agent判断代码。不知道你们是否知道有一个叫html5test的网站，其中要做用就是判断你的浏览器对HTML5的支持程度，但同时，他还提供了浏览器和设备信息。我在桌面端经过Firefox、Chrome、IE、Safari等测试都很正确，在移动设备端，Apple iPod下测试了Safari、Opera mini和UC，除了UC没法识别外其余都OK，另外在Nokia E63下也作了测试，默认浏览器OK，UC没法识别。html5

既然HTML5TEST已经作的如此全面，连浏览器、引擎、设备类型和设备名称等都包罗万象，那就说明在User Agent上的判断应该是作的很是不错的，至少，是我现今看到的最好的了。而后又看到HTML5TEST自己是开源的，那就下载下来分析一下吧。看事后，没有想到，HTML5TEST居然封装的那么好，一个JS包含了基本上所有的User Agent判断，这个js文件，能够直接浏览这里。java

我把这个JS单独拿出来，再加上几句html，作了个浏览器测试的页面，你们能够经过访问这个页面来查看本身的浏览器信息、设备信息等，效果请见下图。地址：http://rovertang.com/labs/useragent/git

我想，经过这一个js，获得了浏览器信息、设备类型和设备名称，接下来怎么作就看你本身的了，不过也有一个小小的担忧：一个大于50K的js文件，对页面的加载彷佛是有点压力的。github

顺便说一下，发现IE对HTML5的DOCTYPE标签支持不是很好，有测试不经过的现象。万恶的IE确实挺让人恼火的。web

最后推荐一个FireFox的组件吧，我想许多人都用过，就是User Agent Switcher，做用呢就是在FF下假装成其余浏览器，好比iPhone的浏览器，这样就能够直接在FF下浏览移动网页进行代码分析了。chrome

源码以下：浏览器

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>useragent判断器</title>
	<meta http-equiv="X-UA-Compatible" content="chrome=1">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="viewport" content="width=device-width; initial-scale=1.0; minimum-scale=1.0; maximum-scale=1.0; user-scalable=no;">
	<script src='useragents.js' type='text/javascript'></script>
	</head>

	<body>
	<script>
	//alert(navigator.userAgent);
	Browsers = new UserAgents(navigator.userAgent);
	var txt = "browserName: " + (Browsers.browser.name ? Browsers.browser.name : '') + '<br />' +
	"browserChannel: " + (Browsers.browser.channel ? Browsers.browser.channel : '') + '<br />' +
	"browserVersion: " + (Browsers.browser.version ? Browsers.browser.version.toString() : '') + '<br />' +
	"browserVersionType: " + (Browsers.browser.version ? Browsers.browser.version.type : '') + '<br />' +
	"browserVersionMajor: " + (Browsers.browser.version ? Browsers.browser.version.major : '') + '<br />' +
	"browserVersionMinor: " + (Browsers.browser.version ? Browsers.browser.version.minor : '') + '<br />' +
	"browserVersionOriginal: " + (Browsers.browser.version ? Browsers.browser.version.original : '') + '<br />' +
	"browserMode: " + (Browsers.browser.mode ? Browsers.browser.mode : '') + '<br />' +
	"engineName: " + (Browsers.engine.name ? Browsers.engine.name : '') + '<br />' +
	"engineVersion: " + (Browsers.engine.version ? Browsers.engine.version.toString() : '') + '<br />' +
	"osName: " + (Browsers.os.name ? Browsers.os.name : '') + '<br />' +
	"osVersion: " + (Browsers.os.version ? Browsers.os.version.toString() : '') + '<br />' +
	"deviceManufacturer: " + (Browsers.device.manufacturer ? Browsers.device.manufacturer : '') + '<br />' +
	"deviceModel: " + (Browsers.device.model ? Browsers.device.model : '') + '<br />' +
	"deviceType: " + (Browsers.device.type ? Browsers.device.type : '') + '<br />' +
	"useragent: " + navigator.userAgent + '<br />' +
	"humanReadable: " + Browsers.toString();
	//alert(txt);
	window.document.write(txt);
	</script>
	<br><br><br><br>
	<a href="http://rovertang.com/blog/archives/555">Read More ... </a><br>
	Powered by <a href="http://www.html5test.com">html5test</a><br>
	Modified by
	<a href="http://rovertang.com">RoverTang</a>
	</body>
	</html>

【原文地址：http://www.cnblogs.com/Tangf/archive/2012/03/25/2416605.html】app