![](https://cdn-ak-scissors.b.st-hatena.com/image/square/454eb9d7c93fab72fb99232abb26b24eb67655d4/height=288;version=1;width=512/https%3A%2F%2Fqiita-user-contents.imgix.net%2Fhttps%253A%252F%252Fcdn.qiita.com%252Fassets%252Fpublic%252Farticle-ogp-background-412672c5f0600ab9a64263b751f1bc81.png%3Fixlib%3Drb-4.0.0%26w%3D1200%26mark64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZ3PTk3MiZoPTM3OCZ0eHQ9JUU5JTk2JThCJUU3JTk5JUJBJUU0JUJEJTkzJUU5JUE4JTkzJUUzJTgyJTkyJUU1JUE0JTg5JUUzJTgxJTg4JUUzJTgyJThCJTIxJTIwQ2hyb21lJTIwRGV2VG9vbHMlMjBUaXBzJTIwNyVFOSU4MSVCOCZ0eHQtYWxpZ249bGVmdCUyQ3RvcCZ0eHQtY29sb3I9JTIzMjEyMTIxJnR4dC1mb250PUhpcmFnaW5vJTIwU2FucyUyMFc2JnR4dC1zaXplPTU2JnM9NTkyYzgwMDRkNzc3NDIyMzY5MjUwNTFmY2Q3ZjQ5MGM%26mark-x%3D142%26mark-y%3D57%26blend64%3DaHR0cHM6Ly9xaWl0YS11c2VyLWNvbnRlbnRzLmltZ2l4Lm5ldC9-dGV4dD9peGxpYj1yYi00LjAuMCZoPTc2Jnc9NzcwJnR4dD0lNDByeW8yMTMyJnR4dC1jb2xvcj0lMjMyMTIxMjEmdHh0LWZvbnQ9SGlyYWdpbm8lMjBTYW5zJTIwVzYmdHh0LXNpemU9MzYmdHh0LWFsaWduPWxlZnQlMkN0b3Amcz1iYzVhZGI5NDMzZTZjMjgwN2Q4YjFhYzc2YmY0Mzc4NA%26blend-x%3D142%26blend-y%3D486%26blend-mode%3Dnormal%26s%3D9566c49b71a319d04d39d031d3319ea8)
エントリーの編集
![loading...](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/common/loading@2x.gif)
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
記事へのコメント27件
- 注目コメント
- 新着コメント
![Knoa Knoa](https://cdn.profile-image.st-hatena.com/users/Knoa/profile.png)
Knoa
要素のスクショは間もなくアップデートで右クリックメニューに追加されるよ! https://twitter.com/JecelynYeen/status/1278699767485198336
![yarumato yarumato](https://cdn.profile-image.st-hatena.com/users/yarumato/profile.png)
yarumato
“$0で選択中のDOM要素の取得。$(selector) セレクタに一致するDOM要素を返す。$$(selector)セレクタに一致するDOM要素の配列を返す。$x(path)xpathに一致するDOM要素の配列を返す。使用していないCSS、JSの調査”
![Knoa Knoa](https://cdn.profile-image.st-hatena.com/users/Knoa/profile.png)
Knoa
要素のスクショは間もなくアップデートで右クリックメニューに追加されるよ! https://twitter.com/JecelynYeen/status/1278699767485198336
![utwang utwang](https://cdn.profile-image.st-hatena.com/users/utwang/profile.png)
utwang
jQueryないのに$使えてるなと思ってたけど、Dev toolのutilityだったのか。恥ずかしながら知らなかった。 https://developers.google.com/web/tools/chrome-devtools/console/utilities
![sgo2 sgo2](https://cdn.profile-image.st-hatena.com/users/sgo2/profile.png)
sgo2
data:text/html, <body contenteditable> ←をアドレスバーに打ち込めばブラウザが即席メモ帳になるというtipsで contenteditable を知った。
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
![アプリのスクリーンショット](https://b.st-hatena.com/bdefb8944296a0957e54cebcfefc25c4dcff9f5f/images/v4/public/entry/app-screenshot.png)
いまの話題をアプリでチェック!
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
開発体験を変える! Chrome DevTools Tips 7選 - Qiita
最近Chrome DevToolsについて調べていて発見した便利機能を紹介します。 誰もが使える最高便利な開発マ...示
最近Chrome DevToolsについて調べていて発見した便利機能を紹介します。 誰もが使える最高便利な開発マシンChrome DevToolsを使いこなして開発体験を変えましょう! 1. $0で選択中のDOM要素の取得 特定の要素に何かしたいという時には、要素のIDやclassを確認してConsoleでdocument.querySelector("#xxx")で取得するというのが一般的だと思います。実はそれはカーソル選択と$0で代替できます。 Classや、IDがついていない特定のDOMを取得したい時とかにも使えるので地味に便利です。 手順 カーソルで取得したい要素を選ぶ Consoleタブで$0を入力 最近知ったChrome DevToolsの便利機能① $0 での選択中のDOM要素取得Elementsタブで選択状態のDOM要素は、Console上で $0 を入力することで取得で
2020/08/18 リンク