Internet Explorer を HTML5 対応ブラウザにする解決策 (html5shiv を使用)_html5 チュートリアル スキル

現在、HTML5 はますます注目を集めていますが、HTML5 をサポートするブラウザはまだ主流ではありません。特に、HTML5 をサポートする IE9 は Xp システムのインストールをサポートしていないため、まだ 50% 近くのユーザーが使用しています。将来に影響を与える HTML5 開発者は、長い間、下位互換性の問題を考慮する必要があります。 HTML5 タグまたは CSS セレクターとの互換性を実現するには多くの方法がありますが、その 1 つはタグ要素を自分で生成することです。

基本原理については、IE8 での次のコードの効果を参照してください。スタイルはまったく効果がありません。

コードをコピー

コードは次のとおりです:

こんにちは!< /mxria>

ブラウザが タグを認識し、対応するスタイルの効果を表示するには、次のように js を追加すると、別の効果が表示されます。

コードをコピーコードは次のとおりです。

< head>

<script>document.createElement("mxria")</script>
🎜>

これで秘密がわかりました!はい、それは document.createElement です。HTML5 shiv はすべての HTML5 タグを再生成するような js プラグインです。プラグインをロードすると、HTML5 プログラムがすべてのブラウザーで認識されます。 ダウンロード アドレス: http://html5shim.googlecode.com/svn/trunk/html5.js

trunk/html5.js を使用する簡単な方法:

以下は Google から引用した html5.js ファイルです:

html5shiv の使用は非常に簡単で、IE9 が html5 をサポートしていることを考慮すると、次のコードをページの先頭に追加するだけです:

コードをコピーコードは次のとおりです:

上記のコードを head セクションにコピーします。これが head セクションである必要があることに注意してください (要素が解析される前に IE はこの要素を認識する必要があるため、この js ファイルは他の場所から呼び出すことができません。そうしないと無効になります)

もちろん、コードを取り出して自分で理解することもできます:

(function(){if(!/*@cc_on!@*/0)return;var e="abbr,article,aside,audio,canvas,datalist,details,dialog,eventsource,figure,footer,header ,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(','),i=e.length;while(i--){document.createElement(e[i] )}})()

最後に次の段落を CSS に追加します:

/*html5*/article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}

主に、これらの html5 タグを div などのブロックにします。

わかりました。簡単に説明すると、HTML5 タグをブロック化するには html5.js を引用します