tamakipedia

かまくらぴよぴよフロントエンジニア

ディベロッパーツールの検索系 「cmd + F」で文字検索 「cmd + P」でファイル内検索

最近知ったchromeディベロッパーツールの検索機能

ファイル内検索 「cmd + F 」

Elementでの「検索」コマンド ・cmd + F

f:id:okinawanpizza:20201024150442p:plain

画面の赤枠の位置に入力スペースが出現します。

さらに文字列を検索するだけでなく、

div.class#id

のようなXPathと呼ばれる書き方でも検索が可能とのこと。
実際にやってみます。

今回は div要素の class="sticky-header" を検索してみます。
div.sticky-headerと入力。

f:id:okinawanpizza:20201024151035p:plain

お〜

同じように「cmd + P 」でファイルが検索できます。

cmd + F と cmd + Pがあるだけで一発で検証箇所を特定できて作業効率アップですね!