找出应用给定 CSS 类的所有元素？答案

【问题标题】：Find out all elements a given CSS class is applied to?找出应用给定 CSS 类的所有元素？
【发布时间】：2014-08-31 07:16:18
【问题描述】：

Firebug / Web Developer Tools 或任何其他扩展是否具有向我显示所有附加/应用了给定 CSS 类的元素的功能？

所以当我从源中选择一个 CSS 类时（比如说，在 Firebug 中），我希望看到应用了这个类的所有元素。

【问题讨论】：

【解决方案1】：

基本上你可能会找到匹配某个选择器的元素，如下所示：document.querySelectorAll('.firstclass.secondclass')

【讨论】：

是的，完全正确。但这是 jQuery 的事情吗？有没有这样的插件？
不，这是原生的。点击链接，它会显示哪些浏览器支持它。（基本上是 IE8 和更新版本。）
我想除了您指定的答案之外，没有比这更好的答案了。我现在可以调整一下。
这只查找当前页面选择器。不跨页面。如果你已经有 firebug 或 chrome 开发工具，你可以通过 ctrl+f 找到选择器，那有点没用
@user2734550 不，没那么没用。如果您在页面上的许多地方都与您正在寻找的内容相匹配。这将允许您在控制台中很好地收集它们，而不必在元素查看器中跳转。这只是功能。它对某些事情有用，而对其他事情则不然。但仅仅因为你不觉得它有用并不意味着它对任何人都没有用。无论如何，消极情绪是怎么回事？有一个更好的答案，发布你自己的答案，而不是抨击别人。

【解决方案2】：

您可以使用两个原生 DOM 函数来实现此目的：

现在所有主流浏览器都支持这两种方法已经有一段时间了。

示例：

document.getElementsByClassName("firstClass secondClass")
document.querySelectorAll(".firstClass.secondClass")

【讨论】：