使用JavaScript获取伪元素属性

Question

我正在尝试使用JavaScript getComputedStyle 读取伪元素的CSS属性 -

window.getComputedStyle(document.querySelectorAll('.myClass')[1], ':after').getPropertyValue('top')

但是，返回的值为＆＃39; px ＆＃39;在Chrome中以及＆＃39; ％＆＃39;在Firefox和IE中。

有没有办法在所有浏览器中获得一致的结果？

Answer 1

这可能是罪魁祸首......

根据window.getComputedStyle()的 MDN documentation ：

  

备注

     

getComputedStyle返回的值称为已解决   值。这些通常与CSS 2.1计算值相同，但是   对于一些较旧的属性，如宽度，高度或填充，它们是   而是使用的值。最初，CSS 2.0定义了计算机   值之后是属性的“随时可用”的最终值   级联和继承，但CSS 2.1将计算值重新定义为   预布局，并使用值作为后布局。对于CSS 2.0属性，   getComputedStyle函数返回计算的旧含义   值，现在称为使用值。预先区别的一个例子   布局后的值包括百分比的分辨率   表示元素的宽度或高度（也称为它   布局），因为它们将被它们的像素等效替换   二手价值案例。

此 documentation for used value 也是相关的。