jQuery修改CSS偽元素屬性的方法_jquery

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");