ホームページ > 記事 > ウェブフロントエンド > HTML 5 の機能を検出するにはどうすればよいですか? _html/css_WEB-ITnose
元の翻訳アドレス: http://www.ido321.com/1116.html
翻訳: HTML5 機能検出
翻訳者: dwqs
HTML 5 の人気により、HTML 5 は現在主要市場を占めています共有、HTML 5 には、Web エクスペリエンスを向上させる多くの新機能が追加されています。ほとんどの機能は最新の主流ブラウザーでサポートされているため、これらの新機能を安全に使用して Web エクスペリエンスを向上させることができます。ただし、ブラウザの新しいバージョンがリリースされた場合、古いバージョンまたは古いブラウザの一部を忘れてはなりません。
現在、ユーザーは新機能をサポートするために古いバージョンのブラウザを使用したいと考えているということも事実です。したがって、作成される製品はクロスブラウザーである必要があり、私たちができる唯一のことは、コードを実行する前に、指定された機能がブラウザーでサポートされていることを確認する HTML5 機能検出です。
Modernizr は、HTML 5 と CSS 3 の機能検出を完了できる非常に優れた JS ライブラリです。デフォルトでは、modernizr はすべての機能を検出します (もちろんカスタマイズ可能) が、JS ライブラリ全体をインポートせずに特定の機能のみを検出したい場合は、コードを適切な場所に配置する必要があります。この記事では、ネイティブ js と modernizr を使用して HTML 5 の機能を検出する方法を説明します。
rree
Video
rree
ローカルストレージ
rree
Web ワーカー
// JSreturn !!document.createElement('canvas').getContext; // Modernizrif (Modernizr.canvas) {}
オフライン Web アプリケーション
// JSreturn !!document.createElement('video').canPlayType; // Modernizrif (Modernizr.video) { }
地理位置情報
// JSreturn 'localStorage' in window && window['localStorage'] !== null; // Modernizrif (Modernizr.localstorage) { }
// JSreturn !!window.Worker; // Modernizrif (Modernizr.webworkers) { }
// JSreturn !!window.applicationCache; // Modernizrif (Modernizr.applicationcache) { }
Microdata
// JSreturn 'geolocation' in navigator; // Modernizrif (Modernizr.geolocation) { }
// JSvar i = document.createElement('input');return 'placeholder' in i; // Modernizrif (Modernizr.input.placeholder) { }
これまでのところ、これは私が特徴検出用のコードリストを収集しました。リストで共有したい機能検出コードがある場合は、私に知らせることもできます。
---------------------------------------------- --- --------------------------------------------------- --- --------------------------------------------------- --- ------------------------
これは、Web 開発、モバイル開発、Java およびその他のプログラミング言語、包括的な情報、SEO およびその他の有名ブログ、ブログコレクションアドレス: http://www.ido321.com/daohang/