本文介绍如何利用 JavaScript 的 window.getComputedStyle 方法配合伪元素选择器（如 :before）来获取 CSS 伪元素的样式属性。该方法兼容现代浏览器，但在 IE9 以下版本存在限制，需结合 currentStyle 进行兼容处理。
JavaScript 获取 CSS 伪元素属性值的实现方法
CSS 伪元素功能强大，常用于创建 CSS 三角形提示或实现无需额外 HTML 标签的简单视觉效果。传统上，JavaScript 无法直接获取这些伪元素的属性值，但如今存在一种可行的解决方案。
参考以下 CSS 代码示例：
.element:before {
content: 'NEW';
color: rgb(255, 0, 0);
}.element:before {
content: 'NEW';
color: rgb(255, 0, 0);
}若要获取 .element:before 的颜色属性，可使用如下代码：
var color = window.getComputedStyle(
document.querySelector('.element'), ':before'
).getPropertyValue('color')var color = window.getComputedStyle(
document.querySelector('.element'), ':before'
).getPropertyValue('color')将伪元素作为第二个参数传入 window.getComputedStyle 方法，即可获取其 CSS 属性。建议将此代码纳入工具函数库，随着浏览器对伪元素支持的普及，该方法的实用性将日益凸显。
译者注：window.getComputedStyle 方法在 IE9 以下浏览器中不支持，且 getPropertyValue 需配合 getComputedStyle 使用。IE 虽支持 CurrentStyle 属性，但仍无法获取伪元素属性。
这是准确获取指定元素 CSS 属性值的有效方法。
<script type="text/javascript">
function getStyle( elem, name )
{
//如果该属性存在于style[]中，则它最近被设置过(且就是当前的)
if (elem.style[name])
{
return elem.style[name];
}
//否则，尝试IE的方式
else if (elem.currentStyle)
{
return elem.currentStyle[name];
}
//或者W3C的方法，如果存在的话
else if (document.defaultView && document.defaultView.getComputedStyle)
{
//它使用传统的"text-Align"风格的规则书写方式，而不是"textAlign"
name = name.replace(/([A-Z])/g,"-$1");
name = name.toLowerCase();
//获取style对象并取得属性的值(如果存在的话)
var s = document.defaultView.getComputedStyle(elem,"");
return s && s.getPropertyValue(name);
//否则，就是在使用其它的浏览器
}
else
{
return null;
}
}
</script>