Internet Explorer 9-最も包括的な開発者ガイド（その他）

Internet Explorerは、頻繁に更新されないブラウザとして知られています。 なぜこれが起こっているのか、それが正しいか間違っているのか、長い間議論することができます。 しかし、間違いなく他のことを言うことができます-Internet Explorerに表示される機能は、開発者の最大限の注意に値します。 これは、IE自体とその機能が主流であり、原則として、リリース時には他のほとんどのブラウザーに実装されているために発生します。



例外は、ネイティブJSONサポート、 HTML5 DOMストレージのサポート、プロセスへのタブの分離、 HTML 5ネットワークイベントなど、他の多くのブラウザーの前にInternet Explorer 8で導入されたいくつかのものです。



この点で、今でも最も人気のあるブラウザーの9番目のバージョン（ただし、おそらく最も機能的で便利ではない）が提供する新しい機能を知って、覚えておくことが重要だと思います。

リトリート...

Internet Explorer 9に関する特別なセクションがHabréに登場したことに多くの人が気づいたと思いますが、これはおそらく、ブラウザの革新を普及させることを目的としたRuNetの最初のそのような動きです。 Habrのセクションでは、ロシア語のIE9チームからのテストに精通し、Habrを離れることなくすぐにテストできます。 また、便利なリンクと、マシンにブラウザをインストールする機能も提供します。 試してみてください。

はじめに

はじめにではなく、Internet Explorer 9の現状と作成の進捗についてお話したいと思います。 ブラウザのテストバージョンの最初の言及とデモンストレーションは、2009年のPDC会議で開催されました。 ブラウザがグラフィックスを高速化し、GPUアクセラレーションによるテキスト処理とフォントスムージングに新しいDirect 2D APIを使用する方法を示しました。



その後、しばらくして、IE9開発チームがHTML5およびSVG委員会に参加し、これらの技術のサポートを発表したという情報が現れました。 多くの人が長い間SVGを待っていましたが、このニュースは嬉しかったと思います。



次のブラウザ現象は、2010年のMIX会議で行われました。 ここでは、新しい機会が示されただけでなく、最初はテストアセンブリを自分で試す機会が与えられました。 http://ie.microsoft.com/testdrive/にあるテストバージョンは、現在2番目のバージョンで利用可能です。 さらに、開発者は多くの作業を行い、Internet Explorer 9がもたらす新機能を示すために多くの視覚的なデモンストレーションを作成しました。開発者は6〜8週間ごとに公開テスト用のIE9の新しいバージョンをリリースすることを約束しました



IE9の最初のテストバージョンには多くの新しいものが含まれていましたが、おそらく最も重要なのは、SVGとJavaScriptに基づいたGPUで高速化されたグラフィックスとアニメーションでした。 Chakraと呼ばれる新しいJavaScriptエンジンは、SunSpiderテストにおけるFirefoxの主要な競合他社の大幅な加速と追い越しに満足しています。 標準サポートの指標としてのACID3テストでは、IE8の20ポイントではなく55ポイントが与えられ始めました。 さらに、Internet Explorerはついに100％CSS3セレクターのサポートを獲得しました。



IE9の2番目のテストビルドは、さらに多くの革新をもたらしました。 この記事では、それらと他のすべてについて説明します。 6月の3番目のビルドで見られる主なものは、GPUを使用して高速化されたHTML5ビデオのサポートです。

CSS標準のサポート

Internet Explorerチームは、ドラフトステータスを終了するまでオープンスタンダードを急いで実装しないことを長い間知られています。 これには多くの理由がありますが、私が判断できるように、主なことはIEがオペレーティングシステムの一部であり、それに加えられた変更は長期的であるべきだということです。 ブラウザバージョンの開発が遅いという性質は、これに起因しています。 しかし、誰もがこれを好むわけではありません。 開発者は、APIの変更によりコードを経時的に変更しなければならない場合でも、常に革新の最前線にいることを望んでいます。 マイクロソフトは、明らかに、そのようなアクションを行う余裕がなく、ブラウザーの慎重な革新のポリシーを順守しています。



この点に関して、CSS3のサポートに関しては、 次の表を参照して、IE9で可能な実装について説明する際にどのCSS3モジュールを議論できるかを理解する必要があります。 Candidate Recommendationのステータスを持つ標準が多くないことを確認できます。 しかし、Microsoftがブラウザに実装するのはまさにそれらであると確信できます。 そして、この推測のいくつかの確認があります。

CSS3 Backgrounds＆Bordersモジュール

Internet Explorer 9は、ユーザーと多くのデザイナーの両方に愛されている、丸みを帯びたコーナー-境界半径の待望のサポートをもたらします。 次のプロパティがサポートされています。

• 境界半径
• ボーダー下部左半径
• 境界線下右半径
• ボーダートップ左半径
• ボーダー右上の半径

さらに、開発者は、コーナーの実装がブラウザー間で最も正確で正しいことを誇りに思っています。 これは 、異なるブラウザーでこのテストに合格することで確認できます。 たとえば、4つのブラウザーのどのバージョンがより適切で正しいと思いますか？







これらのモジュールプロパティに加えて、開発者はIE9の将来のテストおよび最終バージョンで他のプロパティを実装する予定です。

CSS3カラーモジュール

IE9の2番目のテストバージョンでのこのモジュールのサポートは、RGBAとopacityプロパティの実装にあります。 アプリケーション：



背景色：rgba（255,0,0,0.5）;



そして



不透明度 ：40％;



このモジュールの他のプロパティは、開発中に追加されます。

CSS3 Media Queriesモジュール

このテストページで、このモジュールのプロパティの操作に慣れることができます 。 つまり、このモジュールでは、現在のサイズやその他の表示設定に応じて、異なるCSSコードを使用するブラウザーの機能について説明します。 そのため、この例では、表示されるウィンドウのサイズを小さくすると、小さなウィンドウでは異なって見える画像を含む外観が変化し、それらのミニチュアの外観が適用されます。



コード例：



@media（最大幅：899px）{

#demodescription {

ディスプレイ：なし;

}

}



まだ



@media（最小幅：450px）および（最大幅：950px）{

.placeTitleLong、.bigPhoto、.description {

ディスプレイ：なし;

}

}



IE9のこの機能を別の記事で解析してみます。

CSS3名前空間モジュール

Internet Explorer 9はこのモジュールをほぼ完全にサポートしているため、CSSの名前空間を定義できます。 モジュールの詳細については、 仕様をご覧ください。

CSS3セレクター

IE9は、 仕様によりCSS3セレクターをサポートし、 http：//tools.css3.info/selectors-test/test.htmlのテストに100％合格します。







Internet Explorer 8はテストに合格し、「43個のセレクタのうち22個が合格し、1個はバグあり、20個はサポートされていません（578個のテストのうち349個合格）」という結果になりました。



さらに、IE9には、CSS3仕様で定義されていないいくつかのセレクターが含まれています。 この擬似クラス：不確定（暗黙的な状態のコントロールを選択できます）および擬似要素::選択（ユーザーがマークしたマークアップを選択できます）。

ダタリ

データ：URIは CSSのモジュールではありませんが、CSSで積極的に使用されています。 データ：URIは、イメージのInternet Explorer 8でサポートされています。 現在、IE9 Data：URIはsrc属性のscript要素に使用できます。

DOM標準のサポート

Internet Explorer 9は、DOMレベル2のサポートを拡張し、選択したDOMレベル3機能のサポートを追加します。

DOMコア（L2およびL3）およびDOMビュー（L2）

DOMレベル2コア機能のサポートが追加されました。

• DocumentType
• 処理命令
• createDocument

DOM名前空間と関連プロパティのサポートを追加しました

• namespaceURI
• localName
• プレフィックス

開発者は、 DOMレベル3コアの多くのプロパティのサポートとDOMレベル2ビューの完全サポートを報告しています。

DOMレベル2およびDOMレベル3イベント

IE9チームは、標準メソッドを選択してattachEventをオプトアウトできる標準イベント処理モデルを実装しました。

• addEventListener 、 removeEventListener 、 createEvent 、 dispatchEvent
• イベントオブジェクト、UIEvent、MouseEvent
• DOMAttrModified
• DOMレベル3イベントDOMContentLoaded、CustomEvent、KeyboardEvent、DragEvent
• イベントcompositionstart 、 compositionupdate 、 compositionend

DOMレベル2 HTML

IE9では、待望のgetElementsByClassNameのサポートに加えて、 characterSetなどのHTML5の他のプロパティが導入されました。 開発者は、テーブルのオブジェクトモデルが大幅に改善され、フォームを操作できると主張しています。

DOMレベル2の範囲とHTML5の選択

IE9は、ページの選択されたフラグメントにアクセスするためのDOM L2トラバーサルおよび範囲およびHTML5選択標準の両方のAPIを完全にサポートします。 たとえば、 setSelectionRangeメソッド。 またはHTML5から： getSelection、selectionStart、selectionEnd 。

DOMレベル2スタイル

IE9は、以前のように機能を介してではなく、標準に従って仕様サポートを実装します。 開発者は、これらの機能のテストページを準備しました。

DOM L2トラバーサル

IE9は、 DOM L2トラバーサルおよび範囲仕様の次のプロパティのサポートを追加します： NodeIterator、TreeWalker、whatToShow、およびNodeFilter。 これらのメソッドにより、DOM要素をフィルタリングおよびバイパスできます。

HTML5

IE9で導入されたHTML5標準の一部の機能については、既に上記で説明しました。 さらに、IE8が1年以上前に、 DOMストレージ 、 クロスドキュメントメッセージング 、 Ajaxナビゲーション （window.location。Hashプロパティ）などのHTML5機能をいくつか導入したことを言及する価値があります。



開発者は、IE9でのHTMLコードの解析は、HTML5ドラフト仕様草案の推奨事項に非常に近いと主張しています。

一般化された要素

以前、Internet ExplorerはHTMLで未知のタグを無関係な要素と見なし、CSS定義をスキップして考慮しませんでした。 これにより、次の例が導かれました。



<style type = "text / css">

mydiv {

色：青;

フォントの太さ：太字。

}

</ style>

...

<p>この文では<mydiv>ジェネリック要素</ mydiv>を使用しています。</ p>



開発者が期待していたため、IE8では表示されませんでした。







Internet Explorer 9では、開発者がこのような汎用要素のサポートを追加し、作成者が意図したとおりにレンダリングが行われるようになりました。

重複する要素

以前は、Internet ExplorerはHTML5で規定されているタグの重複をサポートしていませんでした。

<b>この<i>が</ b>スクリプトに与える影響</ i>に注意する必要があります。

JavaScriptで処理した場合、結果は作成者が意図したものとは異なる場合があります。 Internet Explorer 9は、HTML5ドラフト仕様に従って、このようなシナリオのサポートを導入しました。

解析スタイルとスクリプトブロックの変更

Internet Explorerの以前のバージョンは、スタイルとスクリプトブロックをDOMツリーの一部として認識していませんでした。 IE9では、このようなブロックをDOMの一部として操作する機会が得られます。 これにより、埋め込みコードにツリー内のプレーンテキストとしてアクセスできます。

XHTML解析

IE9は、MIME アプリケーション/ xhtml + xmlを含むドキュメントをXHTMLとして解析します。

SVGの解析...結論の代わりに

SVG、ICCプロファイル、およびGPUアクセラレーションのサポートについては、記事の後半で説明します。 その中で、IE9開発者向けのツールの更新と、IE9のテストバージョンの外観が見苦しい理由についても説明します。