HTML5的草案诞生于2004年，在2007年时被W3C（World Wide Web Consortium）采纳。尽管各主流的浏览器厂商都对HTML5提供了程度不同的支持，但毕竟HTML5是一种全新的HTML标记语言，相较以前的版本增加了许多新功能，所以其中某些新功能还未被某些浏览器支持；另外，同一浏览器的不同版本对HTML5 的支持力度也不同，例如微软（Microsoft）公司的IE浏览器系列中，IE9以下的版本是不支持HTML5的。
因此，检测浏览器是否支持HTML5是非常必要的，现将从网上摘录的几种方法展示如下：
1.在全局对象上检测：
<!DOCTYPE html>
<html lang="zh_CN">
<head>
<meta chatset="UTF-8">
<title>applicationCache Test</title>
<script>
window.onload = function() {
if (Window.applicationCache){
document.write("Yes, your browser can use offline web applications.");
} else {
document.write("No, your browser cannot use offline web applications.");
}
}
</script>
</head>
<body>
</body>
</html>
在创建的元素上检测
<html lang="zh_CN">
<head>
<meta charset="UTF-8">
<meta author="suifengtec">
<title>Simple Square</title>
<script type="text/javascript">
window.onload = drawSquare;
function drawSquare () {
var canvas = document.getElementById('Simple.Square');
if (canvas.getContext) {
var context = canvas.getContext('2d');
context.fillStyle = "rgb(13, 118, 208)";
context.fillRect(2, 2, 98, 98);
} else {
alert("Canvas API requires an HTML5 compliant browser.");
}
}
</script>
</head>
<body>
<canvas id="Simple.Square" width="100" height="100"></canvas>
</body>
</html>
检测某HTML5方法是否返回期望的值
<!doctype html>
<html lang="zh_CN">
<head>
<meta charset="UTF-8">
<meta author="suifengtec">
<title>Video Test</title>
<script>
function videoCheck() {
return !!document.createElement("video").canPlayType;
}
function h264Check() {
if (!videoCheck) {
document.write("not");
return;
}
var video = document.createElement("video");
if (!video.canPlayType('video/mp4; codecs="avc1.42E01E, mp4a.40.2"')) {
document.write("not");
}
return;
}
document.write("Your browser does ");
h264Check();
document.write(" support H.264 video.");
</script>
</head>
<body>
</body>
</html>
检测HTML5元素是否能保留值
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
<!doctype html>
<html lang="zh_CN">
<head>
<meta charset="UTF-8">
<meta author="suifengtec">
<title>Range Input Test</title>
<script>
function rangeCheck() {
var i = document.createElement("input");
i.setAttribute("type", "range");
if (i.type == "text") {
document.write("not");
}
return;
}
document.write("Your browser does ");
rangeCheck();
document.write(" support the <code><input type=range></code> input type.");
</script>
</head>
<body>
</body>
</html>
本站仅提供存储服务，所有内容均由用户发布，如发现有害或侵权内容，请
点击举报。
