html5特性检测
//canvas
var myCanvas = document.createElement("canvas");
if (!!myCanvas.getContext) {
//alert('support canvas api');
} else {
//alert('no support canvas api');
}
//canvas fileText
var myCanvas = document.createElement("canvas");
if (!!myCanvas.getContext) {
//get canvas content panel
var context = myCanvas.getContext('2d');
//alert(context.fillText);
//alert(typeof context.fillText);
if (typeof (context.fillText) == 'function') {
//alert('internet exploer is support canvas text api');
}
} else {
//alert('no support');
}
//video
var myVideo = document.createElement("video");
if (!!myVideo.canPlayType) {
//alert('support video api');
//detect video the specific video format
var myViedoflag = myVideo
.canPlayType('video/mp4;codecs="avc1.42E01E,mp4a.40.2"');
//alert(myViedoflag);
switch (myViedoflag) {
case 'probably':
//alert(' the internet exploer is probably support mp4');
break;
case 'maybe':
//alert(' the internet exploer is maybe support mp4');
break;
default:
//alert(' no support mp4');
break;
}
var myViedoflag = myVideo
.canPlayType('video/ogg;codecs="theora,vorbis"');
//alert(myViedoflag);
switch (myViedoflag) {
case 'probably':
//alert(' the internet exploer is probably supportogg');
break;
case 'maybe':
//alert(' the internet exploer is maybe support ogg');
break;
default:
//alert(' no support ogg');
break;
}
var myViedoflag = myVideo.canPlayType('video/webm;codecs="vp8,vorbis"');
//alert(myViedoflag);
switch (myViedoflag) {
case 'probably':
//alert(' the internet exploer is probably support webm');
break;
case 'maybe':
//alert(' the internet exploer is maybe support webm');
break;
default:
//alert(' no support webm');
break;
}
} else {
//alert('no support video api');
}
//detection detection探测,检测 local storage
if (window.localStorage) {
//alert(window.localStorage);
//alert('internet exploer is support local storage!');
} else {
//alert('internet exploer is no support local storage!');
}
//detection web Workers
if (window.Worker) {
//alert(window.Worker);
//alert('internet exploer is support Worker!');
} else {
//alert('internet exploer is no support Worker!');
}
if (window.applicationCache) {
//alert(window.applicationCache);
//alert('internet exploer is support applicationCache!');
} else {
//alert('internet exploer is no support applicationCache!');
}
if (navigator.geolocation) {
//alert(navigator.geolocation);
//alert('internet exploer is support geolocation!');
} else {
//alert('internet exploer is no support geolocation!');
}
HTML5学习笔记:
<!--[if !supportLists]-->1. <!--[endif]-->html5特性检测
Html5特性(Y/N) |
IE9 |
CHROME11 |
canvas |
Y |
Y |
Canvas fillText |
Y |
Y |
vedio |
Y |
Y |
Vedio format of mp4 |
Y |
Y |
Vedio format of ogg |
N |
Y |
Vedio format of webm |
N |
Y |
Local storage |
N |
Y |
Web workers |
N |
Y |
离线web应用 |
N |
Y |
Geolocation地理位置 |
Y |
Y |
|
|
|
Html5特性(Y/N) |
IE9 |
CHROME11 |
canvas |
Y |
Y |
Canvas fillText |
Y |
Y |
vedio |
Y |
Y |
Vedio format of mp4 |
Y |
Y |
Vedio format of ogg |
N |
Y |
Vedio format of webm |
N |
Y |
Local storage |
N |
Y |
Web workers |
N |
Y |
离线web应用 |
N |
Y |
Geolocation地理位置 |
Y |
Y |
<input type="search" /> |
N |
Y |
<input type="number" /> |
N |
Y |
<input type="range" /> |
N |
Y |
<input type="color" /> |
N |
N |
<input type="tel" /> |
N |
N |
<input type="url" /> |
N |
N |
<input type="date" /> |
N |
Y |
<input type="email" /> |
N |
N |
<input type="month" /> |
N |
Y |
<input type="week" /> |
N |
Y |
<input type="time" /> |
N |
Y |
<input type="datetime" /> |
N |
Y |
<input type="datetime-local" /> |
N |
Y |
<input placeholder="hehehehh"/> |
N |
Y |
<input autofocus="autofocus"/> |
N |
Y |