1. 伪元素非 dom 元素，jq无法操作，但可以间接影响。
2. 操作方式
2.1 修改类
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style type="text/css">
.techbrood:before {
content: 'no';
color: red;
} .techbrood.change:before {
content: 'yes';
}
</style>
</head> <body> <div class="techbrood" id="td_pseudo">techbrood introduction</div> <script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script>
// $('#td_pseudo').addClass("change");
</script> </body> </html>
2.2 改变增值属性
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style type="text/css">
p {
color: deepskyblue;
} p:before {
content: attr(data-beforeContent);
color: darkred;
}
</style>
</head> <body> <p data-beforeContent="测试">1111</p>
<script type="text/javascript" src="jquery-1.9.1.min.js"></script>
<script> $(function () {
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> </body> </html>