IE10 の HTML5 解析

아티클
09/01/2011

本記事は、マイクロソフト本社の IE チームのブログから記事を抜粋し、翻訳したものです。

【元記事】HTML5 Parsing in IE10 (2011/7/7 6:47 AM)

Web 開発においては、さまざまなブラウザー間で同じマークアップと同じコードを使って、同じ結果を得られることが望まれます。IE10 platform preview 2 は、HTML5 解析アルゴリズムを完全にサポートすることにより、この目標に一歩近づきました。

マイクロソフトは以前のリリースから継続してこの課題に取り組んでおり、より多くの HTML が異なるブラウザー間で "そのまま" 動作することを目指して、IE の HTML パーサーを改良し続けています。主な改良点として、インライン SVG のサポート、HTML5 セマンティック要素のサポート、不明な要素に対する構造の維持、空白処理の改善などが挙げられます。この取り組みの結果、HTML の大半は、IE9 とその他のブラウザーで同様に解析されるようになりました。

正しい動作の適用

この取り組みの目標は、すべての HTML を、現在使用されているさまざまなブラウザー間で同様に解析できるようにすることです。これが実現可能であると考えるのは、HTML5 は、HTML として初めて、発生する確率の極めて低いエッジケースやエラー条件に至るまで、あらゆるケースに対応した HTML 解析ルールを定義しているからです。HTML5 は、誤って記述されたマークアップについても解析方法を定義しており、IE10 はこれらのルールに準拠しています。今回の改良点の一部として、修正された箇所を以下に示します。

HTML	IE10 の HTML5 解析	DOM ( IE9 )
<b>1<i>2</b>	\|- <b> \|- "1" \|- <i> \|- "2"	\|- <b> \|- "1" \|- <i> \|- "2" \|- <i>
<p>Test 1 < object> <p>Test 2 < /object>	\|- <p> \|- "Test 1\n" \|- <object> \|- "\n " \|- <p> \|- "Test 2\n"	\|- <p> \|- "Test 1\n" \|- <object> \|- "\n " \|- <p> \|- "Test 2\n"

相互運用可能な innerHTML

今回のリリースでは、innerHTML も改善されており、今後は以下のようなパターンのコードが、IE10 で期待どおりに動作するようになります。

var select = document.createElement("select");
select.innerHTML = "<option>one</option><option>two</option>";
var table = document.createElement("table");
table.innerHTML = "<tr><td>one</td><td>two</td></tr>";

開発者に嬉しいエラー報告

HTML5 では、あらゆるマークアップが一貫した方法で解析されます。とはいえ、開発者は間違ったマークアップの記述を避けることを第一に考えるべきでしょう。有効なマークアップを記述すれば、サイトが期待どおりに動作しやすくなり、過去のバージョンのブラウザーとの互換性確保にもつながります。

開発者のこうしたニーズを考慮して、IE10 では F12 開発者ツールで解析エラーが報告されるようになりました。

レガシ機能の削除

IE のこれまでのバージョンで使われていた一部の機能は、HTML5 解析と互換性がないため、IE10 モードから削除されています。このようなレガシ機能を利用しているサイトも、レガシモードで実行することにより、引き続き動作します。開発者がサイトを更新する時間がなかったとしても、この方法により、現在動作しているサイトは IE10 でも問題なく動作します。

条件付きコメント

条件付きコメントは従来どおり使用できますが、IE の以前のバージョンでのみ有効になります。最新のブラウザーを判別するには、フィーチャー ディテクション ( 機能検出) を使用してください。

エレメントビヘイビア

<html xmlns:my>
<?import namespace="my" implementation="my.htc">
<my:element>
ここの記述は、IE10 と他のブラウザーでは不明な要素として解析されます。
IE の以前のバージョンでは、"my.htc" にバインドされます。
</my:element>
</html>

XML データアイランド

<xml>
ここの記述は、IE10 と他のブラウザーでは <b>HTML</b> として解析されます。
IE の以前のバージョンでは、XML として解析されます。
</xml>

フィードバックをお待ちしています

皆様のフィードバックを参考に、すべての HTML (innerHTML を用いたものも含む) が異なるブラウザー間で同様に解析されるよう、さらなる改良を進めていきます。ぜひ、IE10 platform preview 2 をダウンロードして使ってみてください。もしバグを発見した場合は、Connect からご報告をお願いいたします。

—Tony Ross、Internet Explorer プログラムマネージャー

다음을 통해 공유

IE10 の HTML5 解析

추가 리소스