重要: Internet Explorer 11 デスクトップ アプリケーションは 2022 年 6 月 15 日より廃止され、特定のバージョンのWindows 10はサポートされていません

Microsoft Edgeでは、Internet Explorer モードで Internet Explorer を必要とする古いレガシ サイトに引き続きアクセスできます。 方法について説明します

Internet Explorer 11 デスクトップ アプリケーションは、より高速で安全なMicrosoft Edgeブラウザーに段階的にリダイレクトされ、最終的にはWindows Update経由で無効になります。 IE を今すぐ無効にします

この更新プログラムについて

優れた Web ページを開発するには、コーディングの専門知識と、必然的に発生する問題を見つけてデバッグするための適切なツールが必要です。 この更新プログラムは、F12 UI、コンソール、DOM エクスプローラー、デバッガー、エミュレーション ツール、UI 応答性、メモリ プロファイル ツールの機能とバグ修正の両方を含む、F12 開発者ツールに大幅な改善を提供します。 
 

F12 ユーザー インターフェイスの変更

新しいアイコンと通知メモリ ツールと Profiler ツールのアイコンが変更されました。

アイコン バーには、コンソールのエラー、エミュレーション設定の変更、およびメモリ、プロファイラー、UI の応答性ツールのアクティブなプロファイリング セッションに関するインジケーターが表示されるようになりました。 次の図は、コンソールとメモリ ツールのアイコンに通知が表示された新しいアイコンを示しています。これは、2 つのコンソール エラーが表示されていることと、メモリ プロファイル セッションが現在進行中であることを示しています:
新しいインターフェイス

ツール内の F6 スーパーセット ナビゲーション使用 F6 は、Tab キーを使用してツールを移動する場合と似ていますが、選択可能なすべての項目ではなく、ツール ウィンドウで最もよく使用される要素の選択したセットを "タブ" で移動します。 これは、キーボードを使用してツール内とツール間を移動するための全体的なクリーン システムの一部です。

キーボードを使用して最近使用したツール間を前後に移動する Ctrl + [ を使用すると、ツールのナビゲーション履歴で後方に移動し、Ctrl + ] を使用して、参照中の前後の矢印と同様に進むことができます。

ドキュメント モードへのクイック アクセス:インターフェイスの上部に新しいドロップダウン リストが追加され、どのツールからでもドキュメント モードにアクセスできるため、ツールを切り替える必要はありません。
ドロップダウン

コンソールの変更

Console.timeStamp()コンソールまたはコード内から呼び出されると、Console.timeStamp() は、現在のブラウザー タブが開かれているミリ秒数をコンソールに出力します。 UI 応答性ツールを使用してプロファイル セッションの実行中に呼び出された場合は、セッションが開始されてからの時間に基づいて、タイム スタンプと共にセッションのタイムラインにユーザー マークが作成されます。

Ctrl + L キーを押すと、すべてのメッセージのコンソールがクリアされます

正確なオートコンプリートコンソールのオートコンプリートにインデクサープロパティが含まれなくなりました。 これにより、オートコンプリート候補をよりクリーンかつ正確に選択できます。

$、$$、$x、$0-$5、および $_ がコンソールオートコンプリートリストに追加され、コンソールの動作が他のブラウザーとの整合性が向上しました。

古いメッセージ インジケーター[移動時にクリア] オプションをオフにした場合は、以前のコンソール メッセージのアイコンが灰色表示され、アクティブなページのメッセージと履歴内の以前のページのメッセージを区別するのに役立ちます。
古いメッセージ インジケーター

DOM エクスプローラーの変更

[計算] ウィンドウの [変更バー] ユーザーが [スタイル] ウィンドウを楽しんだ変更バー (変更されたプロパティ、追加されたプロパティ、および削除されたプロパティの色が異なる) が、[計算スタイル] ウィンドウに表示されるようになりました。
[計算済み] ウィンドウのバーを変更する

デバッガーの変更

ソース マップ指定デバッガーでドキュメントのタブを右クリックすると、ソース マップを指定できます。 これにより、ソース マップのコメントを削除した配布済みコードと共にソース マップを使用できます。
Sourcemaps が指定する

WatchesNow のオートコンプリートでは、ウォッチを追加するときにオートコンプリート オプションをお勧めします。
ウォッチのオートコンプリート

戻り値の検査:戻り値を持つ関数を分割する場合は、終了中かっこにステップインするまで関数にステップインします。 戻り値は、[ウォッチ] ウィンドウの [ローカル] セクションに表示されます。 もう一度ステップを実行すると、その値を呼び出したコードに値が返されます。

簡単なデモについては、コンソールで次のコードを試してください。

function showval() { var x = 0; x++; debugger; return x; } showval(); 

関数を呼び出し、デバッガーで中断し、それにステップインして戻り値を確認できます。

ブレークポイントの複数選択 Ctrl + クリック、Shift + クリック、Ctrl + A を使用して、[ブレークポイント] ウィンドウで複数のブレークポイントを選択できます。

breakPress F5 を続行して無視して、次の中断に進みます。 F5 キーを押しながら、F5 をリリースするまで、複数の区切りを超えて続行します。

イベント ブレークポイントとトレースポイントこれらの動作は、F12 ツールに既に存在するブレークポイントとトレースポイントと同様ですが、特定のコード ブロックが実行されたときにトリガーされるのではなく、特定のイベントが発生したときにトリガーされます。 それぞれには、検査するイベントの特定のインスタンスにスコープを絞り込むために役立つオプションの条件付きフィルターがあります。 これらは、次の図で強調表示されている [イベント トレースポイントの追加] アイコンと [イベント ブレークポイントの追加] アイコンを使用して追加できます:
イベント ブレークポイントとトレースポイント

UI の応答性ツールの変更

パフォーマンス セッションをインポート/エクスポートする場合、生成されたデータを分析したり、そのデータを同僚と共有したりするたびに、テスト ケースを再現する必要はありません。 UI 応答性ツールのアイコン バーのインポート (フォルダー) アイコンとエクスポート (ディスク) アイコンを使用すると、メモリ スナップショットを後でインポートできるファイルに保存できます。

Image preview 画像に対する HTTP 要求を見て、どのイメージだったのか疑問に思った場合は、イベントの詳細でイメージがプレビューされます。
イメージ プレビュー

イベントをフィルター処理するイベントのフィルター処理ボタンは小さいが強力です。 そのボタンの背後には、複数の方法でイベントをフィルター処理できるメニューがあり、それぞれの方法に大きな影響があります。

  • イベント名フィルター: フィルター テキストの一致を含む任意のイベント名をフィルター処理します。

  • UI アクティビティ フィルター: チェック ボックスを使用すると、調査している領域に集中しやすいように、大きなカテゴリのイベントを除外できます。 たとえば、ネットワーク アクティビティのみに関心がある場合は、UI とガベージ コレクションのすべてのノイズを除外できます。

  • 時間しきい値フィルター: この機能は、期間が 1 ミリ秒未満の最上位のイベントを除外します。 多くのシナリオでは、ウォーターフォール ビューが大幅に簡素化され、よりインパクトのあるイベントに集中できます。
    時間しきい値フィルター

HTML5 スクリプト イベント メディア クエリ リスナー または MutationObservers を使用する場合、パフォーマンス プロファイル セッションを実行するときにそれぞれのコストを特定できるようになりました。
HTML5 スクリプト イベント

フレームのグループ化ドロップダウン リストと [フィルター イベント] メニューの間のボタンは、フレームのグループ化を切り替えます。 これにより、アニメーションやビジュアルの更新が発生していた期間に、最上位レベルのイベントが対応する作業単位 (または "フレーム") にグループ化されます。 フレームは他のイベントと同様に扱われるため、並べ替えやフィルター処理が可能で、包括的な時間の概要が提供されます。
フレームのグループ化

ユーザーメジャー Performance.mark() API を使用してタイムラインに三角形を追加して特定のイベントが発生した場所を示す場合、performance.measure() API はパフォーマンス マークの有用性を拡張します。 performance.measure() を使用して、2 つの performance.mark() イベント間の時間を含む User measure イベントを作成し、イベントを右クリックし、[イベントにフィルター処理] オプションを使用して、2 つのマークの間のイベントのみを選択します。
ユーザー メジャー

DOMThis 機能の色化は、DOM 要素、文字列リテラル、および数値リテラルに色付けを追加します。 さまざまな F12 ツール内のコンテンツの外観と動作を同じようにする以外に、UI の応答性ツールに視覚的な関心が高くなります。

選択の概要タイムラインの一部を選択すると、[イベントの詳細] ウィンドウに選択内容の概要が表示されます。 循環グラフの異なるセグメントにマウス ポインターを合わせると、そのセグメントのイベント カテゴリを持つツールヒントが表示されます。
選択の概要

console.timeStamp()コード内またはプロファイリング セッション中にコンソールで console.timeStamp() メソッドを使用すると、プロファイル セッションが開始されてからの時間を持つユーザー マークがタイムラインに作成されます。

メモリ ツールの変更

ドミネーターの折りたたみDominator の折りたたみは、別のオブジェクトの論理的なコンポーネントである最上位ビュー (たとえば、<DIV>>内の<BR>内のスコープ) からオブジェクトを削除することでスナップショットの内容を簡略化するのに役立ち、データに対する洞察を向上させない余分な詳細になりがちです。 しかし、時間を無駄にする可能性があります。 

たとえば、次の画像はビューの前後を示しており、ドミネーターの折りたたみによってツールが伝える "ストーリー" がどのように改善されるかを示しています。 折りたたまれたビューには、15.64 メガバイト (MB) のメモリを占め、デタッチされた DOM ノードに保持されている 30 個の HTML <DIV>要素が表示されます。 多くの場合、オブジェクトの構成を知ることは重要ではなく、単にオブジェクトが大きすぎる、または漏れている (特にサード パーティ製ライブラリを使用している場合)。
ドミネーターの折りたたみ

DOM、文字列&数値リテラルの色化この機能は、DOM 要素、文字列リテラル、および数値リテラルに色付けを追加します。 さまざまな F12 ツール内のコンテンツの外観と動作を向上させる以外に、メモリ分析をより視覚的に興味深くします。

ルート サイクル filteringWant を使用すると、循環参照パスで知らずに失われることなくオブジェクトの構成を調査できますか? この機能は、循環型の子参照を検出し、それらを無限に走査して混乱しないように"トリミング" します。 さらに、参照が "トリミング" されたときに明確になるように、これらの参照に注釈を付けます。

セッションをインポート/エクスポートする必要はありません。テスト ケースが生成されたデータを分析したり、そのデータを同僚と共有したりするたびに、テスト ケースを再現する必要はありません。 メモリ ツールのアイコン バーにあるインポート (フォルダー) アイコンとエクスポート (ディスク) アイコンを使用すると、メモリ スナップショットを後でインポートできるファイルに保存できます。
インポート/エクスポート セッション

エミュレーション ツールの変更

設定永続化と resetA Persist エミュレーション設定アイコンがエミュレーション ツールに追加されます。 これにより、具体的に無効になるまで、現在のエミュレーション設定が維持されます。 これにより、作業を行い、ブラウザーを閉じてから、エミュレーション設定をそのまま使用して戻ってきます。 このアイコンの右側には、[エミュレーションのリセット] 設定アイコンがあり、ツールをすばやく既定値にリセットします。
設定永続化とリセット



さらに、この更新プログラムには、IE 開発者チャネルからのフィードバックに基づく次の機能強化が含まれています。

  • デスクトップ上の任意のウィンドウから色を選択できるカラー ピッカーを DOM エクスプローラーに追加します。

  • タイマーと XHR 応答の関連する非同期呼び出しから呼び出し履歴を追加します。

Internet Explorer 11 で F12 開発者ツールを使用する方法の詳細については、次の Microsoft Web サイトを参照してください。

F12 開発者ツールの使用

IE 開発者チャネル

更新プログラムの情報

この更新プログラムは、最初にセキュリティ更新プログラム 2976627に含まれていました。

2976627 MS14-051: Internet Explorer の累積的なセキュリティ更新プログラム: 2014 年 8 月 12 日
注: IE 開発者チャネルから F12 開発者ツールのプレビューをインストールした場合は、この更新プログラムをインストールする前にそのバージョンをアンインストールする必要はありません。

Internet Explorer 用の最新の累積的なセキュリティ更新プログラムをインストールするには、 Microsoft Update に移動します。

Internet Explorer の最新の累積的なセキュリティ更新プログラムの技術情報については、次の Microsoft Web サイトを参照してください。

http://www.microsoft.com/technet/security/current.aspx

ヘルプを表示

スキルを磨く
トレーニングの探索
新機能を最初に入手
Microsoft Insider に参加する

この情報は役に立ちましたか?

言語の品質にどの程度満足していますか?
どのような要因がお客様の操作性に影響しましたか?

ご意見をいただきありがとうございます。

×