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

Sofia Emelianova
Sofia Emelianova

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

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

概要

[検索] パネルでは、読み込まれたすべてのリソースからテキストを検索できます。正規表現や大文字と小文字を区別するオプションも使用できます。テキストを見つけたら、[ソース] パネルでソースを確認できます。

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

  • DevTools の右上にある DevTools のカスタマイズと管理 [DevTools のカスタマイズと制御] > [その他のツール] > [検索] を選択します。
  • Esc キーを押して [ドロワー] を開き、左上にある DevTools のカスタマイズと制御 [その他のツール] > [検索] を選択します。
  • Command+Option+F(Mac)または Ctrl+Shift+F(Windows / Linux)を押します。

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

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

検索結果。

DevTools で 1 行内に複数の一致が見つかると、検索結果には、すべて同じ行番号でリストされます。検索結果をクリックすると、DevTools で [ソース] の行が開き、一致する行がスクロールして表示されます。

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

大文字と小文字を区別ボタン。

正規表現に一致するテキストを検索するには、[] ボタンの [正規表現] をオンにします。

正規表現ボタン。

クエリの再実行、展開、結果のクリア

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

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

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

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

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

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

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

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

すべての DevTools パネルとタブに検索バーが組み込まれているわけではありませんが、組み込まれている場合はツール固有の機能が提供されることがよくあります。以下に、検索バーを備えたツールとその機能の一覧を示します。

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