Detect Browser

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>detect browser</title>
</head>
<body>
<div id="welcome">
<p>欢迎使用 <b></b> detect browser</p>
</div> //使用whatismybrowser网站检测
<iframe src ="https://www.whatismybrowser.com/feature/iframe?size=small&bgcolor=BFBFB0&color=3E4759&bordercolor=8C7268&capabilities=true&screen=true&ip_address=true&viewmore=true" width ="340" height ="330" style ="border:none;"></iframe> <script type="text/javascript">
window.onload=function(){
console.log("start:");
//检测无头浏览器
if (/HeadlessChrome/.test(window.navigator.userAgent)) {
console.log("Chrome headless detected");
}
if(navigator.plugins.length == 0) {
console.log("It may be Chrome headless");
}
if(navigator.languages == "") {
console.log("Chrome headless detected");
} var canvas = document.createElement('canvas');
var gl = canvas.getContext('webgl'); var debugInfo = gl.getExtension('WEBGL_debug_renderer_info');
var vendor = gl.getParameter(debugInfo.UNMASKED_VENDOR_WEBGL);
var renderer = gl.getParameter(debugInfo.UNMASKED_RENDERER_WEBGL); if(vendor == "Brian Paul" && renderer == "Mesa OffScreen") {
console.log("Chrome headless detected");
} // if(!Modernizr["hairline"]) {
// console.log("It may be Chrome headless");
// } var body = document.getElementsByTagName("body")[0];
var image = document.createElement("img");
image.src = "https://ss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=144388917,3393541021&fm=27&gp=0.jpg";
image.setAttribute("id", "fakeimage");
body.appendChild(image);
image.onerror = function(){
if(image.width == 0 && image.height == 0) {
console.log("Chrome headless detected");
}
} // 判断浏览器
// Opera 8.0+
var isOpera = (!!window.opr && !!opr.addons) || !!window.opera || navigator.userAgent.indexOf(' OPR/') >= 0; // Firefox 1.0+
var isFirefox = typeof InstallTrigger !== 'undefined'; // Safari 3.0+ "[object HTMLElementConstructor]"
var isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || (typeof safari !== 'undefined' && safari.pushNotification)); // Internet Explorer 6-11
var isIE = /*@cc_on!@*/false || !!document.documentMode; // Edge 20+
var isEdge = !isIE && !!window.StyleMedia; // Chrome 1 - 71
var isChrome = !!window.chrome && (!!window.chrome.webstore || !!window.chrome.runtime); // Blink engine detection
var isBlink = (isChrome || isOpera) && !!window.CSS; var output = 'Detecting browsers by ducktyping:<hr>';
output += 'isFirefox: ' + isFirefox + '<br>';
output += 'isChrome: ' + isChrome + '<br>';
output += 'isSafari: ' + isSafari + '<br>';
output += 'isOpera: ' + isOpera + '<br>';
output += 'isIE: ' + isIE + '<br>';
output += 'isEdge: ' + isEdge + '<br>';
output += 'isBlink: ' + isBlink + '<br>';
console.log(output); //浏览器、版本、操作系统检测
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"; console.log(this.browser);
console.log(this.version);
console.log(this.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: "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(); // mobile
var isMobile = {
Android: function() {
return navigator.userAgent.match(/Android/i);
},
BlackBerry: function() {
return navigator.userAgent.match(/BlackBerry/i);
},
iOS: function() {
return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera: function() {
return navigator.userAgent.match(/Opera Mini/i);
},
Windows: function() {
return navigator.userAgent.match(/IEMobile/i);
},
any: function() {
return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
}
};
console.log("end!");
} //判断Chromium
function isChromium()
{
for (var i = 0, u="Chromium", l =u.length; i < navigator.plugins.length; i++)
{
if (navigator.plugins[i].name != null && navigator.plugins[i].name.substr(0, l) === u)
return true;
}
return false;
}
</script>
</body>
</html>

参考链接

JavaScript检测浏览器的更多相关文章

  1. Javascript检测浏览器对CSS属性的支持 /* supports */

    //检测浏览器对CSS属性的支持 supports = (function() { var div = document.createElement('div'), vendors = 'Khtml ...

  2. 用 JavaScript 检测浏览器在线/离线状态(JavaScript API — navigator.onLine)

    如今HTML5 移动应用或 Web app 中越来越普遍的使用了离线浏览技术,所以用 JavaScript 检测浏览器在线/离线状态非常常见. 无论浏览器是否在线,navigator.onLine 属 ...

  3. 使用JavaScript检测浏览器

    假设你真的需要检测浏览器的类型,使用JavaScript非常easy达到. View Demo Download Source from GitHub JavaScript有一个navigator的标 ...

  4. javascript检测浏览器的缩放状态实现代码 是指浏览器网页内容的百分比缩放(按Ctrl和+号键或者-号键的缩放)

    这里所说的缩放不是指浏览器大小的缩放,而是指浏览器网页内容的百分比缩放(按Ctrl和+号键或者-号键的缩放).检测这种缩放有很种方法,QQ空间都通过flash来检测浏览器是否处于缩放.这里提供java ...

  5. [译]JavaScript检测浏览器前缀

    原文地址: Detect Vendor Prefix with JavaScript 不管浏览器私有前缀的现状如何,我们还是要与之为伴,并且有时候还需要利用它来做一些事情.这些前缀可以用于CSS(比如 ...

  6. javascript 检测浏览器类型和版本的代码

    方法1:对象/特征检测法 该方法是一种判断浏览器能力(而非浏览器的确切型号)的通用方法.大部分JS专家认为这个方法最合适,因为他们认为按照该方法所编写的脚本是经得起未来考验的. //获取IE浏览器的版 ...

  7. 检测浏览器版本类型的JavaScript代码,终极版

    下面的JavaScript代码,不仅可以判断PC端浏览器类型,还可以判断安卓.iOS.其他智能手机.平板电脑或游戏系统. 说废话貌似不是我的风格哈,直接上代码吧: var client = funct ...

  8. javascript检测当前浏览器是否为微信浏览器

    <!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8& ...

  9. [转]JavaScript快速检测浏览器对CSS3特性的支持

    转自:https://yuguo.us/weblog/detect-css-support-in-browsers-with-javascript/ ------------------------- ...

随机推荐

  1. linux 之oracle静默安装

    一.安装前准备工作1.修改主机名#vi /etc/hosts   //并添加内网IP地址对应的hostname,如下127.0.0.1           localhost::1           ...

  2. Qt代码配色VS2015风格

    通过本文的方法可以将VS2015的深色主题界面应用到Qt上,对于喜欢VS代码风格配色的人应该会比较有用 效果图:  1. 设置IDE主题 为了配合vs深色的代码编辑背景,将Qt的主题也换成深色版本 2 ...

  3. mongo 导入import 导出 exprot操作

    .mongo export导出 /mongoexport /h [ip地址] /port [端口] /u [用户名] /p [密码] /d [数据库] -c [表名] /q [查询语句]  /o [保 ...

  4. 数据库info.sql

    /* Navicat MySQL Data Transfer Source Server : loaderman Source Server Version : 50540 Source Host : ...

  5. osg model

    osg::ref_ptr<osg::Node> MyOSGLoadEarth::CreateNode() { osg::ref_ptr<osg::Group> _root = ...

  6. linux下将文件上传到svn服务器

    linux下将文件上传到svn服务器 摘自:https://blog.csdn.net/sky_yangge/article/details/41544773 2014年11月27日 16:47:57 ...

  7. python中 将数字转化为人民币的形式

    def fn(args): """ 将金额转化为人民币模式,带逗号分隔,保留小数点两位,四舍五入 :param args: :return: ""&q ...

  8. webstrom报错 缺少JSCS 怎么解决

  9. Saltstack把网卡从ens160修改成eth0

    手动修改参考:https://www.cnblogs.com/minseo/p/8521873.html salt目录结构为 files/grub GRUB_TIMEOUT=5 GRUB_DISTRI ...

  10. python:序列化与反序列化(json、pickle、shelve)

    本节内容 前言 json模块 pickle模块 shelve模块 总结 一.前言 1. 现实需求 每种编程语言都有各自的数据类型,其中面向对象的编程语言还允许开发者自定义数据类型(如:自定义类),Py ...