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

ソフィア・エメリアノバ
Sofia Emelianova

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

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

[検索] タブを開くには、いくつかの方法があります。まず、DevTools を開き、次のいずれかを行います。

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

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

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

検索結果。

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

クエリで大文字と小文字を区別するには、大文字と小文字を区別してください。 [Match Case] ボタンを切り替えます。

Match Case ボタン。

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

[正規表現] ボタン。

クエリを再実行し、結果を展開してクリアする

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

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

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

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

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

組み込みの検索バーを使用すると、特定のツールで開かれたリソースに検索範囲を絞り込むことができます(ツールが対応している場合)。

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

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

すべての DevTools パネルとタブに組み込みの検索バーがあるわけではありませんが、そのようなパネルやタブには、ツール固有の機能が含まれていることがよくあります。検索バーを含むツールとその機能は次のとおりです。

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