IE は、HTML5 要素を認識していないため、HTML5 要素を無視します。Modernizr ドキュメントから
Modernizr は、JavaScript の小さなループを実行して、HTML5 のさまざまな要素 (および abbr) を Internet Explorer でのスタイリングに使用できるようにします。これは、突然 IE が Audio 要素または Video 要素をサポートするようになるという意味ではありません。div の代わりに section を使用して CSS でスタイルを設定できることを意味するだけです。
これは、Modernizr が IE に HTML5 の新しいタグを伝えて、CSS を使用できるようにするが、実際には何もさせないということです。また、Modernizr は要素のデフォルト スタイルを追加しないため、たとえば<section>
タグを作成する HTML5 CSS リセットを使用することをお勧めします。display: block;
フォームの検証に関しては、Modernizr はブラウザーの機能のみを検出し、実際には何もしないことを説明したトピックは正しかったです。Modernizr の背後にあるプロセスは、組み込みの yepnope テスト機能を使用して、ユーザーのブラウザーが「x」(この場合はフォーム検証) を実行できるかどうかを確認し、条件付きで非同期にスクリプトまたはスタイルを読み込んで「ポリフィル」(丁寧な検証) することです。 「javascriptを使用してネイティブの動作を模倣する」という言い方です)。
あなたの場合、おそらく次のようModernizr.load()
にテストするために使用したいと思うModernizr.input.required
でしょうModernizr.input.autofocus
:
//the modernizr conditional load function
Modernizr.load({
//specify the tests, refer to the Modernizr docs for object names
test: Modernizr.input.required && Modernizr.input.placeholder,
//specify what to do if the browser fails the test, can be a function
nope: 'path/to/polyfill/script',
//sometimes you need to run some JS to init that script
complete: function(){ polyfillinitorwhatever(); }
});
かなり簡素化された Modernizr.load が表示されます。彼らのドキュメントは蛇行していると思いますが、実際には非常に優れています。私が問題を抱えて Paul Irish にツイートするたびに、彼はドキュメントへのリンクを送り返してきました。詳しく調べてみると、実際に私の答えが見つかりました。
検証は、ブラウザー メーカーが標準として実装する最も複雑な HTML5 機能の 1 つです。シンプルさがとても気に入っていますが、ユーザーが Chrome または Opera を使用している場合を除いて、すべてのケースで jQuery.validate を使用し続けています。FF ネイティブの検証はまだ弱いです。今のところjQueryを使い続けることをお勧めします。