Web 技术研究所

我一直坚信着,Web 将会成为未来应用程序的主流

获取伪元素的样式

  从IE8开始就支持伪元素了,它已经在各种项目中被使用。普通元素的样式访问很简单,可以直接在元素上找到。但伪元素并没有一个元素引用,访问其样式时需要先访问它的所在的元素,通过getComputedStyle方法传入两个参数来得到伪元素的样式引用。
<style>
a {font-size:14px;color:#F00;}
a:before {content:'[';color:#0F0;}
a:after {content:']';color:#00F;}
</style>
<a href="#">test</a>
<script>
var a=document.querySelector("a");
var self=getComputedStyle(a);
var before=getComputedStyle(a,":before");
var after=getComputedStyle(a,":after");
console.log("self color",self.color);
console.log("before color",before.color);
console.log("after color",after.color);
</script>

  但遗憾的是这个方法只能获取伪元素的样式,无法获取伪类的样式。而且从IE11开始才支持getComputedStyle的第二个参数,目前实用性还不强。
网名:
3.80.55.*
电子邮箱:
仅用于接收通知
提交 悄悄的告诉你,Ctrl+Enter 可以提交哦
神奇海螺
[查看全部主题]
各类Web技术问题讨论区
发起新主题
本模块采用即时聊天邮件通知的模式
让钛合金F5成为历史吧!
次碳酸钴的技术博客,文章原创,转载请保留原文链接 ^_^