検索: 読み込まれたすべてのリソースからテキストを検索する

Sofia Emelianova
Sofia Emelianova

読み込まれたすべてのリソースのテキストを検索するには、[検索] パネルを使用します。

または、組み込みの検索バーを使用して、特定のツールで開いたリソース内のテキストを検索できます。

[検索] パネルは、いくつかの方法で開くことができます。まず、DevTools を開き、次のいずれかを行います。

  • DevTools の右上隅で、DevTools のカスタマイズと制御 [Customize and control DevTools] > [その他のツール] > [検索] を選択します。
  • Esc キーを押してドロワーを開き、左上の DevTools のカスタマイズと制御 [その他のツール] > [検索] を選択します。
  • command+option+F(Mac)または Ctrl+Shift+F(Windows、Linux)を押します。

読み込まれたすべてのリソースのテキストを検索する

読み込まれたすべてのリソースのテキストを検索するには、[検索] パネルの検索バーにクエリを入力して Enter キーを押します。

検索結果。

DevTools で複数の一致が 1 行で見つかった場合、検索結果にはそれらがすべて同じ行番号で表示されます。検索結果をクリックすると、DevTools で [Sources] の行が開き、一致するものがスクロールされて表示されます。

クエリで大文字と小文字を区別するには、[match_case] の [Match case] ボタンを切り替えます。

[Match case] ボタン。

正規表現に一致するテキストを検索するには、[regular_expression] の [正規表現] ボタンを切り替えます。

正規表現のボタン。

クエリの再実行、結果の拡張、クリア

検索クエリを再実行するには、[更新] をタップします。 更新] をクリックします。

すべての検索結果を展開するには:

  • Windows / Linux の場合: Ctrl+Shift+{ または } キーを押します。
  • macOS の場合、command+option+{ または } キーを押します。

検索結果を消去するには、消去] をタップします。 [消去] をクリックします。

特定のツールでテキストを検索する

検索範囲を、特定のツールで開かれたリソースに絞り込むには、組み込みの検索バーを使用できます(ツールでサポートされている場合)。

検索バーには、前後の検索結果にジャンプするための上ボタンと下ボタンがあります。

特定のツールで組み込みの検索バーを開くには、command+F キー(Mac)または Ctrl+F キー(Windows、Linux)を押します。

すべての DevTools パネルとタブに組み込みの検索バーがあるわけではありませんが、組み込みの検索バーでは、ツール固有の機能を利用できることがよくあります。検索バー付きのツールと機能は次のとおりです。

パネルまたはタブ 大文字と小文字を区別 RegEx 範囲 ツール固有の機能
要素 DOM ツリー セレクタと XPath で検索
コンソール チェックします。 チェックします。 ログ メッセージ
出典 チェックします。 チェックします。 現在のソースファイル 次のように置き換えます。
ネットワーク チェックします。 チェックします。 ネットワーク ヘッダーとレスポンス
パフォーマンス チェックします。 チェックします。 アクティビティ
メモリ チェックします。 プロフィール 費用、名前、ファイルでサンプリング プロファイルを検索する
JavaScript プロファイラ チェックします。 CPU プロファイル 費用、名前、ファイルで検索
クイックソース チェックします。 チェックします。 現在のソースファイル 次のように置き換えます。