From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/tools/dom_property_viewer/index.html | 46 +++++++++++++++++++++++++++ 1 file changed, 46 insertions(+) create mode 100644 files/ja/tools/dom_property_viewer/index.html (limited to 'files/ja/tools/dom_property_viewer/index.html') diff --git a/files/ja/tools/dom_property_viewer/index.html b/files/ja/tools/dom_property_viewer/index.html new file mode 100644 index 0000000000..d222a270e2 --- /dev/null +++ b/files/ja/tools/dom_property_viewer/index.html @@ -0,0 +1,46 @@ +--- +title: DOM プロパティビューアー +slug: Tools/DOM_Property_Viewer +tags: + - DOM + - Tools + - Web Development +translation_of: Tools/DOM_Property_Viewer +--- +
{{ToolsSidebar}}
+ +
DOM プロパティビューアーは Firefox 48 の新機能です。これはデフォルトで無効にしています。開発ツールのオプション で有効化できます。
+ +

DOM プロパティビューアーは、現在のページまたは 選択したフレーム の {{domxref("window")}} オブジェクトから始まる {{Glossary("DOM")}} のプロパティを、展開可能なツリー構造で調査できるツールです。

+ +

+ +

DOM プロパティビューアーを有効化する

+ +

DOM プロパティビューアーはデフォルトで無効化しています。開発ツールのオプション を開いて、"標準の Firefox 開発ツール" の "DOM" にチェックを入れると有効化されます。

+ +

DOM プロパティビューアーを開く

+ +

有効化すると、Firefox メニューパネル (メニューバーを表示している場合や macOS ではツールメニュー配下) の Web 開発サブメニュー内にある "DOM" を選択する、あるいはキーボードショートカット Ctrl + Shift + W を押下して DOM プロパティビューアーを開くことができます。

+ +

DOM プロパティビューアーがアクティブになっている ツールボックス が、ブラウザウィンドウの下部に現れます。ツールボックスでは "DOM" という名前です。

+ +

DOM プロパティビューアーのユーザインターフェイス

+ +

DOM ツリー

+ +

DOM のさまざまなプロパティを、展開可能なツリーとして表示します。左側にプロパティの名称、右側にプロパティの値を表示します。オブジェクトのプロパティや配列のアイテムは、3 個まで表示します。プロパティに多くの要素が存在する場合は "more..." という注釈がつきます。すべての要素を確認するには、プロパティの項目をクリックしなければなりません。錠前のアイコンは、書き込み不可のプロパティであることを示します。

+ +

表示内容を更新する

+ +

DOM が変化したときは、Refresh ボタンを押して表示内容を更新できます:

+ +

Button to update the DOM Inspector display

+ +

フィルタリング

+ +

ツールバー内に、検索ボックスがあります:

+ +

+ +

これは、検索文字列にマッチするアイテムのみ表示するようフィルタリングします。名称に検索文字列を含むアイテムがマッチします。マッチングの際は大文字・小文字を区別します。

-- cgit v1.2.3-54-g00ecf