找到使用特定css选择器的所有元素

Question

尝试做一些前端设计工作，我需要对我的CSS进行一些调试/测试。

我知道大多数浏览器开发工具，我可以点击元素并获得完整的样式跟踪。

但我想做的是反过来。

我知道选择器，我希望找到与之相关的所有元素（简单的ctrl + f无法正常工作）

我该怎么做？

Answer 1

您肯定可以在document.querySelectorAll的普通Javascript控制台中执行此操作。

因此，如果您想查找与body div.heading h1匹配的所有元素，请执行

document.querySelectorAll('body div.heading h1');

浏览器控制台将显示它找到的元素。当您将鼠标悬停在控制台中的列表中时，大多数也会在页面中突出显示它们。