怎么對HTML 5的特性做檢測？
來源：程序員人生 發布時間：2014-11-19 08:19:14 閱讀次數：2516次
原譯文地址：http://www.ido321.com/1116.html
原文：Detect HTML5 Features
譯文：HTML5特性檢測
譯者：dwqs
隨著HTML 5的流行，現在HTML 5占據了主要的市場份額，HTML 5增加了很多的新功能，這些新功能可讓Web體驗變得更好。大多數特性在現代的主流閱讀器中取得了支持，因此我們可以放心使用這些新特性來增加Web體驗。但是，當有新版本的閱讀器發布時，我們不要忘記1些舊版本或老的閱讀器。
目前的另外1個事實是，用戶想用舊版本的閱讀器來支持新特性。因此建立的產品必須是跨閱讀器的，而我們唯1能做的就是HTML5特性檢測，來確保指定特性被閱讀器支持時才履行代碼。
Modernizr是1個非常好的JS庫，它可以完成對HTML 5和CSS 3的特性檢測。默許情況下，modernizr會對所有特性進行檢測（固然可以自定義），但如果你只想檢測某1個特定功能而不像引入全部JS庫，那你就得把代碼放在正確的位置。在這篇文章中，我們將會看到如何使用原生的js和modernizr來檢測HTML 5 的特性。
Canvas
// JS
return !!document.createElement('canvas').getContext;
// Modernizr
if (Modernizr.canvas) {
}
Video
// JS
return !!document.createElement('video').canPlayType;
// Modernizr
if (Modernizr.video) {
}
Local Storage
// JS
return 'localStorage' in window && window['localStorage'] !== null;
// Modernizr
if (Modernizr.localstorage) {
}
Web Workers
// JS
return !!window.Worker;
// Modernizr
if (Modernizr.webworkers) {
}
Offline Web Application
// JS
return !!window.applicationCache;
// Modernizr
if (Modernizr.applicationcache) {
}
Geolocation
// JS
return 'geolocation' in navigator;
// Modernizr
if (Modernizr.geolocation) {
}
Placeholder Text
// JS
var i = document.createElement('input');
return 'placeholder' in i;
// Modernizr
if (Modernizr.input.placeholder) {
}
Form Autofocus
// JS
var i = document.createElement('input');
return 'autofocus' in i;
// Modernizr
if (Modernizr.input.autofocus) {
}
Microdata
// JS
return !!document.getItems;
// Modernizr does not provide support to detect Microdata
History API(關于其介紹，請戳：http://www.ido321.com/1069.html 文章被伯樂在線轉載：http://blog.jobbole.com/78876/)
// JS
return !!(window.history && history.pushState);
// Modernizr
if (Modernizr.history) {
}
到目前為止，這是我搜集的特性檢測的代碼列表。如果你有特性檢測的代碼想要在列表中分享，也能夠告知我。
-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------
這里涵蓋了Web開發，移動開發，Java等編程語言、綜合資訊、SEO等名博，博客收錄集地址：http://www.ido321.com/daohang/
生活不易，碼農辛苦
如果您覺得本網站對您的學習有所幫助,可以手機掃描二維碼進行捐贈
