如何用JQuery操作CSS伪文档元素before或after中的content
::before，::after是伪元素并非doom元素，所以jquery无法选择伪元素。
如果确实需要实现修改伪元素的样式，可以通过下面的例子。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>pseudo-elements test by zhou2003737</title>
<style type="text/css">
p{
color: deepskyblue;
}
p:before{
content: attr(data-beforeContent);
color: darkred;
}
</style>
</head>
<body>
<p data-beforeContent="测试">1111</p>
</body>
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$(function(){
<!--使用jquery1.8之前版本 click方法更改为toggle-->
var times = 0;
$('p').on('click',function(){
switch (times){
case 0:
$(this).attr('data-beforeContent','你说啥都是对的');
times++;
break;
case 1:
$(this).attr('data-beforeContent','你这么叼咋不上天呢');
times++;
break;
case 2:
$(this).attr('data-beforeContent','那就上天吧');
times++;
break;
default :
times =0;
$(this).attr('data-beforeContent','你说啥都是对的');
times++;
break;
}
});
});
</script>
</html>
已赞过
已踩过<
CSS伪元素:before和:after可以实现很多有趣的功能，我们项目中使用的ionicframework框架的ionic.css文件中大量使用到了这2个伪元素。伪元素可以用来定义样式，但是和正常的dom元素不同，我们没有办法选中这些伪元素，也就不能像普通元素那样来修改它。
这段HTML中我们用到了:before和:after在content前面和后面添加了target-before和target-after。如果我们想实现这个功能：点击按钮的时候，将target-before和target-after变成相应的颜色。这个时候我们就需要修改伪元素中定义的样式了。
Query由美国人John Resig创建，至今已吸引了来自世界各地的众多javascript高手加入其team，包括来自德国的Jörn Zaefferer，罗马尼亚的Stefan Petre等等。jQuery是继prototype之后又一个优秀的Javascrīpt框架。其宗旨是——WRITE LESS,DO MORE,写更少的代码,做更多的事情。
由于目前高校基本尚未开JavaScript的相关课程，目前jQuery的学习，使用，研究都仅限于在职Web程序员之间。
用jq的前提,首先要引用一个有jq的文件
lt;script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
这个是jquery官方最新的地址。可用在自己网站里加个这个，就能使用jquery了。 但仍然建议下载到本地服务器上。
给你提供个思路 你可以通过追加样式名
在css中给这两个样式名加 .style1.style2:before{content:""}
通过优先级去改content
