Menu

Category

Archive

logo


IE8 以前の HTML5

2013-12-22 05:33:00 +0900
  • このエントリーをはてなブックマークに追加

古いブラウザはHTML5に対応していない可能性が高いです。特にIE8以前は問題が深刻で、ブラウザが認識しないHTMLタグを発見すると、空の要素としてDOMに挿入します。この認識しないHTMLタグの子要素としてマークアップしたものが、認識しないHTMLタグの兄弟要素として挿入されてしまいます。例として、

というものを期待していても、article は HTML5 から導入された要素なので、古い IE は認識せず、下記のように解釈します。

これではCSSを適応させたりする際に問題が発生します。その解決方法として、ダミーの要素を作成します。

1 <!--[if lt IE 9]> <script>
2 var e = ("abbr,article,aside,audio,canvas,datalist,details," + "figure,footer,header,hgroup,mark,menu,meter,nav,output," + "progress,section,time,video").split(',');
3 for (var i = 0; i < e.length; i++) { document.createElement(e[i]);
4 } </script> <![endif]—>
1 <!--[if lt IE 9]>
2 <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
3 <![endif]—>

このために Remy Sharp さんという方がライブラリを作成してくれています。オープンソースのMITライセンスなのでどなたでも使用でき、古いブラウザに対応しなければならに時に重宝しそうです。

http://remysharp.com/2009/01/07/html5-enabling-script/