浏览器插件/扩展/插件一次查看所有元素的 id

Question

尽管进行了广泛的 Google 搜索，但我还是找不到我要找的东西，所以我希望有经验的 SO 用户能得到答案。

我正在寻找一个Firefox或Chrome插件，它可以id在实际元素顶部的叠加层内自动显示元素的属性值。例如：

我们的想法是能够快速了解id页面中使用了哪些属性以及在何处使用，而不必使用 Firebug 或 Firefox/Chrome 的 DOM 检查器等工具手动浏览整个页面（它们只允许您查看元素一个一个，没有全貌）。

有人知道可以做到这一点的Firefox/Chrome插件吗？

Answer 1

Firefox / Chrome 的“Web Developer”扩展包含此功能。可以通过单击“信息 -> 显示锚点”来切换该选项。

• https://addons.mozilla.org/en-US/firefox/addon/web-developer/
• https://chrome.google.com/webstore/detail/web-developer/bfbameneiokkgbdmiekhjnmfkcnldhhm

在火狐浏览器中

在 Chrome 中

结果

您也可以$$('[id]')在控制台中输入，而不是安装额外的扩展程序，这会生成一个包含“id”属性的所有元素的列表。