浏览器渲染挂钩

对于您正在尝试实现的这类事情,查看一个名为 Dark Reader . 这个扩展可以使整个页面变暗,但是通过分析代码的CSS,它可以智能地做到这一点。如果有什么东西已经黑了,它就会保持原样。只有在需要对比度的情况下,明亮的背景才会变黑,文本才会变白。 一个图像能让事情变得清晰

原件

呈现的黑暗阅读器

黑暗阅读器使用JS分析CSS和样式,并在页面中注入自己的CSS样式以获得所需的效果。

如果您真的想点击浏览器的渲染管道,那么看看 Project Houdini 这将允许以后对浏览器进行此类自定义。现在还没准备好。

没有每个元素的呈现挂钩,没有。您可以在下一帧呈现之前请求回调(通常每秒有60帧),通过 requestAnimationFrame 但是那不是一个好地方来做你想做的那种检查。

要捕获对单个元素的更改,可以设置 mutation observers 捕捉对其所做的更改 style 属性(哪个 是 通过设置 风格 代码中的属性)。你会想看看这是否会变成性能问题。

所以我怀疑你需要把你所描述的和上面的结合起来:

• 冲刷 style sheets 寻找你想要改变的规则
• 使用要更改的内嵌样式标识元素
• 倾听对 风格 属性,以便在必要时响应这些更改