::before / ::after ),而不必调用?
window.getComputedStyle(element, ":before/:after");
已编辑:答案是不行
getComputedStyle存在性能问题。我需要验证页面上的每个元素是否具有伪元素,这就是为什么性能非常关键的原因。
我尝试从document.styleSheets访问cssRules来查找以::before或::after结尾的选择器,将其删除并查找与其余选择器匹配的元素,但此解决方案有自己的问题:
- 无法访问来自不同域的styleSheets
- 可能有数千个cssRules要检查(再次考虑性能)
我还尝试比较具有和不具有伪元素的元素的大小和偏移量,但没有任何作用。即使没有准确的方法,我也很乐意找到一种方式,可以至少减少30%的要检查的元素数量。
当我确定元素具有伪元素时,最终可以调用getComputedStyle来调查伪元素样式并更改它。这部分完美地工作。
已编辑:我无法控制源页面。页面样式可能会动态从不同的域上传。将我的代码视为内容脚本或库,例如必须更改所有伪元素的前景色,以基于该伪元素的其他CSS属性计算某些颜色。
因此,主要问题是更改基于其他CSS属性进行的,您无法为所有伪元素设置相同的样式,而不实际检索伪元素的计算样式并计算更改。
例如,您拥有youtube.com页面,需要查找所有伪元素并
- 如果此伪元素具有背景图像,则缩放元素
- 如果此伪元素仅包含文本,则将其颜色更改为红色
- 等等...
img
、input
、textarea
、select
等不允许伪元素的替换元素。 - Gabriele Petrioli