css - Devtools 审计显示不需要/注入的 css 规则

Question

所以，在尝试在 Chrome devtools 中调试网页的性能时，我发现我的页面有很长的 css 规则，我没有放在那里。我查看源代码时看不到规则。但是chrome告诉我规则正在执行。规则也明显是恶意的，

.yahoo 之类的东西赞助到 [onclick^="window.open('http://

我的问题是如何找出什么是，我假设，将它注入到我的 DOM 中？当我查看源代码时，我什么都看不到。

我对如何进行有点不知所措。

谢谢你的帮助。

Answer 1

这些很可能是由类似于 AdBlock 的扩展注入的，它注入一个没有 textContent 的内联样式表（就像<style></style>在 DevTools 中一样呈现），而是通过CSSOM API 动态添加所需的规则。

为避免在审核结果中看到这些规则，请禁用 AdBlock 或类似扩展，重新加载页面，然后再次运行审核。