(Confused? Read Detecting HTML5 Features for a conceptual introduction. Want an all-in-one library instead? Try Modernizr.)
<audio>
return !!document.createElement('audio').canPlayType;
<audio>
in MP3 format
var a = document.createElement('audio');
return !!(a.canPlayType && a.canPlayType('audio/mpeg;').replace(/no/, ''));
<audio>
in Vorbis format
var a = document.createElement('audio');
return !!(a.canPlayType && a.canPlayType('audio/ogg; codecs="vorbis"').replace(/no/, ''));
<audio>
in WAV format
var a = document.createElement('audio');
return !!(a.canPlayType && a.canPlayType('audio/wav; codecs="1"').replace(/no/, ''));
<audio>
in AAC format
var a = document.createElement('audio');
return !!(a.canPlayType && a.canPlayType('audio/mp4; codecs="mp4a.40.2"').replace(/no/, ''));
<canvas>
return !!document.createElement('canvas').getContext;
<canvas>
text API
var c = document.createElement('canvas');
return c.getContext && typeof c.getContext('2d').fillText == 'function';
<command>
return 'type' in document.createElement('command');
<datalist>
return 'options' in document.createElement('datalist');
<details>
return 'open' in document.createElement('details');
<device>
return 'type' in document.createElement('device');
<form>
constraint validation
return 'noValidate' in document.createElement('form');
<iframe sandbox>
return 'sandbox' in document.createElement('iframe');
<iframe srcdoc>
return 'srcdoc' in document.createElement('iframe');
<input autofocus>
return 'autofocus' in document.createElement('input');
<input placeholder>
return 'placeholder' in document.createElement('input');
<input type="color">
var i = document.createElement('input');
i.setAttribute('type', 'color');
return i.type !== 'text';
<input type="email">
var i = document.createElement('input');
i.setAttribute('type', 'email');
return i.type !== 'text';
<input type="number">
var i = document.createElement('input');
i.setAttribute('type', 'number');
return i.type !== 'text';
<input type="range">
var i = document.createElement('input');
i.setAttribute('type', 'range');
return i.type !== 'text';
<input type="search">
var i = document.createElement('input');
i.setAttribute('type', 'search');
return i.type !== 'text';
<input type="tel">
var i = document.createElement('input');
i.setAttribute('type', 'tel');
return i.type !== 'text';
<input type="url">
var i = document.createElement('input');
i.setAttribute('type', 'url');
return i.type !== 'text';
<input type="date">
var i = document.createElement('input');
i.setAttribute('type', 'date');
return i.type !== 'text';
<input type="time">
var i = document.createElement('input');
i.setAttribute('type', 'time');
return i.type !== 'text';
<input type="datetime">
var i = document.createElement('input');
i.setAttribute('type', 'datetime');
return i.type !== 'text';
<input type="datetime-local">
var i = document.createElement('input');
i.setAttribute('type', 'datetime-local);
return i.type !== 'text';
<input type="month">
var i = document.createElement('input');
i.setAttribute('type', 'month');
return i.type !== 'text';
<input type="week">
var i = document.createElement('input');
i.setAttribute('type', 'week');
return i.type !== 'text';
<meter>
return 'value' in document.createElement('meter');
<output>
return 'value' in document.createElement('output');
<progress>
return 'value' in document.createElement('progress');
<time>
return 'valueAsDate' in document.createElement('time');
<video>
return !!document.createElement('video').canPlayType;
<video>
captions
return 'track' in document.createElement('track');
<video poster>
return 'poster' in document.createElement('video');
<video>
in WebM format
var v = document.createElement('video');
return !!(v.canPlayType && v.canPlayType('video/webm; codecs="vp8, vorbis"').replace(/no/, ''));
<video>
in H.264 format
var v = document.createElement('video');
return !!(v.canPlayType && v.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"').replace(/no/, ''));
<video>
in Theora format
var v = document.createElement('video');
return !!(v.canPlayType && v.canPlayType('video/ogg; codecs="theora, vorbis"').replace(/no/, ''));
contentEditable
return 'isContentEditable' in document.createElement('span');
Cross-document messaging
return !!window.postMessage;
Drag-and-drop
return 'draggable' in document.createElement('span');
File API
return typeof FileReader != 'undefined';
Geolocation
return !!navigator.geolocation;
History
return !!(window.history && window.history.pushState && window.history.popState);
Local storage
return ('localStorage' in window) && window['localStorage'] !== null;
Microdata
return !!document.getItems;
Offline web applications
return !!window.applicationCache;
Server-sent events
return typeof EventSource !== 'undefined';
Session storage
try {
return ('sessionStorage' in window) && window['sessionStorage'] !== null;
} catch(e) {
return false;
}
SVG
return !!(document.createElementNS && document.createElementNS('http://www.w3.org/2000/svg', 'svg').createSVGRect);
SVG in text/html
var e = document.createElement('div');
e.innerHTML = '<svg></svg>';
return !!(window.SVGSVGElement && e.firstChild instanceof window.SVGSVGElement);
WebSimpleDB
return !!window.indexedDB;
Web Sockets
return !!window.WebSocket;
Web SQL Database
return !!window.openDatabase;
Web Workers
return !!window.Worker;
Undo
return typeof UndoManager !== 'undefined';
❧
Further Reading
Specifications and standards:
JavaScript libraries:
From:http://diveintohtml5.org/everything.html
分享到:
相关推荐
在H5实现人脸活体检测时,常用的技术框架有WebGL、HTML5 Canvas和JavaScript库,如Face++、Azure Face API等。这些工具可以进行实时的图像处理和分析,包括人脸检测(定位眉毛、眼睛、鼻子、嘴巴等关键点)、特征...
JavaScript(简称JS)活体检测是一种基于纯HTML5技术实现的身份验证方法,它在HTTPS安全协议下运行,确保用户在安卓设备上进行身份验证时,能够有效地检测到真实的人脸,而不是静态的照片或其他非活体图像。...
Yolov5是一种高效、准确的目标检测模型,而将它部署到Web应用中可以为用户提供实时的检测服务。Flask是一个轻量级的Python Web框架,非常适合构建API和服务。本项目将详细介绍如何利用Yolov5和Flask构建一个实时目标...
H5(HTML5)作为现代网页开发的标准,结合人脸识别和活体检测功能,可以为用户提供更加便捷和安全的交互体验。本项目“H5人脸识别+活体检测(眨眼&摇头)”就是这样的一个创新实践。 项目中提到的关键技术之一是...
H5(HTML5)是一种网页开发标准,通过JavaScript和WebGL等技术,可以在浏览器环境中运行复杂的计算任务,包括图像处理和AI模型的推理。这样,用户在任何支持H5的设备上,如手机或电脑,都可以使用舌诊服务,无需安装...
YOLOv5的核心是基于PyTorch实现的,它采用了更先进的特征提取网络,如EfficientNet或CSPNet,以及多尺度预测等技术,提高了模型的检测性能。 **Flask框架**:Flask是一个轻量级的Python Web服务器网关接口(WSGI)...
首先,通过前端摄像头捕捉用户面部图像,然后利用深度学习模型进行人脸检测,找到人脸的位置和特征。接着,活体检测算法分析连续的帧数据,判断用户是否为真实活体,例如通过识别微小的面部动作(眨眼、张嘴、摇头等...
在这个"HTML5的人脸识别活体认证实例"中,我们将探讨HTML5如何与现代技术结合,实现人脸识别和活体检测这一前沿功能。 人脸识别是一种生物特征识别技术,通过分析人脸的形状、结构和特征来确认或验证一个人的身份。...
标签"html5 超级玛丽游戏"表明了这个游戏的两大核心特征:使用HTML5技术进行开发,并且是基于经典游戏《超级玛丽》的复刻。这使得游戏可以在现代浏览器上运行,无需额外的插件或应用。 压缩包中的"html5-mario"可能...
标题中的“基于Gabor小波变换的特征提取和人工智能的人脸检测系统源代码”揭示了这个项目的核心技术:Gabor小波变换在人脸识别中的应用,以及人工智能算法在该过程中的角色。这一系统利用了计算机视觉技术和机器学习...
在本文中,我们将探讨如何利用HTML5实现基于浏览器的简单人脸识别活体认证系统。HTML5的媒体元素(如`<video>`和`<canvas>`)以及JavaScript库clmtrackr.js是实现这一功能的关键。 首先,HTML5的`<video>`元素用于...
从晚上下载的例子,发现不能自动获取设备、服务和特征值,这就导致了程序通用性大大降低,在通过自己的摸索后,将这部分功能调试通过,现在已经是一个通用的webapp调用ble的程序了,功能包括搜索、连接蓝牙,选取...
11. **媒体查询**(Media Queries)和响应式设计:通过检测设备特征,如屏幕尺寸、分辨率和方向,实现响应式布局,确保网站在不同设备上都能良好显示。 12. **Web App Manifest**:定义应用的元数据,如应用图标、...
最后,为了确保游戏在各种支持HTML5的浏览器中都能正常运行,开发者需要遵循跨浏览器兼容性原则,可能需要用到特征检测(feature detection)来确定浏览器是否支持特定的HTML5特性。 总之,这个HTML5祖玛游戏源码是...
- **具体特征检测**: 例如,可以通过尝试使用Canvas元素并检查其上下文来判断浏览器是否支持Canvas功能。 #### 标准制定过程 **四、HTML5标准的制定背景** - **标准制定的过程**: HTML5的制定并非一蹴而就,而是...
第1章通过构建一个简单的HTML5页面来讲解如何搭建支持HTML5的浏览器环境、HTML5页面的特征,以及如何检测浏览器对HTML5特性支持情况。 第2章介绍了HTML5中常用的交互元素,例如内容交互元素、菜单交互元素、状态...
这依赖于HTML5的WebGL和MediaStream API,它们支持访问用户的摄像头和处理实时视频流。JavaScript代码可能使用了TensorFlow.js或类似的库来运行在浏览器上的机器学习模型。 5. **应用场景** 这种技术广泛应用于...
2. 特征提取:情绪识别模型会从检测到的人脸图像中提取特征,如面部肌肉的微小变化,然后通过分类器预测对应的情绪类别,如快乐、悲伤、愤怒等。 3. 数据集与标注:为了训练情绪识别模型,需要大量带有情绪标签的...