DevTools のヒント: コンソールのショートカットでワークフローを高速化する方法

Sofia Emelianova
Sofia Emelianova
GitHub

Console Utilities API を使用すると、さまざまなショートカットを提供することで、デバッグ ワークフローを高速化できます。

Console Utilities API を使用すると、次のことが可能になります。

  • document.querySelector() などの長いコマンドを入力する必要はありません。代わりに、jQuery スタイルの $ ショートカットを使用して要素を指定します。
  • [要素] パネルで最後に選択した 5 つの DOM 要素を参照します。
  • XPath で要素をすばやく参照できます。XPath は [要素] パネルでコピーできます。
  • コンストラクタでオブジェクトをクエリします。
  • オブジェクトのキーまたは値のみを一覧表示します。
  • オブジェクトの文字列表現をクリップボードにコピーします。
  • イベント リスナーを取得します。
  • イベントと関数呼び出しをモニタリングする。

Console Utilities API のすべてのショートカットの一覧については、Console Utilities API リファレンスをご覧ください。