CSS偽元素(pseudo elements)不是DOM元素,因此你無法直接選擇到它們。
假設有如下HTML代碼:
<div class="techbrood" id="td_pseudo">techbrood introduction</div>
和CSS代碼:
.techbrood:before {
width: 0;
}
現在你想在某個元素的click事件中動態的把techbrood:before的width屬性設置為100%,
有兩個方法,一個是添加新的樣式:
$('head').append("<style>.techbrood::before{ width:100% }</style>");
(注意該方法將影響所有的class為techbrood的元素)
另外一個方法是為該元素添加新類,並通過設置新類的屬性來達到改變偽元素屬性的效果:
.techbrood.change:before{
width: 100%;
}
jQuery代碼:
$('#td_pseudo').addClass("change");