使用jQuery选择和操作CSS伪元素,例如:: before和:: after

有没有办法使用jQuery 选择/处理CSS伪元素,例如::before::after(以及带有分号的旧版本)?

例如,我的样式表具有以下规则:

.span::after{ content:'foo' }

如何使用jQuery将’foo’更改为’bar’?

回答:

您还可以将内容传递给具有data属性的伪元素,然后使用jQuery进行操作:

在HTML中:

<span>foo</span>

在jQuery中:

$('span').hover(function(){

$(this).attr('data-content','bar');

});

在CSS中:

span:after {

content: attr(data-content) ' any other text you may want';

}

如果要防止显示“其他文本”,可以将其与seucolega的解决方案结合使用,如下所示:

在HTML中:

<span>foo</span>

在jQuery中:

$('span').hover(function(){

$(this).addClass('change').attr('data-content','bar');

});

在CSS中:

span.change:after {

content: attr(data-content) ' any other text you may want';

}

以上是 使用jQuery选择和操作CSS伪元素,例如:: before和:: after 的全部内容, 来源链接: utcz.com/qa/434859.html

回到顶部