JavaScript改變偽元素style的幾種方法

?在寫代碼的時候遇到一個問題,我希望通過JS選中某偽元素以改變它的style,結果并沒有找到可以直接選擇到偽元素的方法,這里參考Pankaj Parashar的一篇博客,摘出幾種簡單方法以改變偽元素的style.
?示例代碼:

html:
<div class="red"></div>
css:
.red::after{
   content:"red";
   color:red;
}

另加類法

css:
.green::after{
    content:"green";
    color:green;
}
js:
$("div").removeClass("red").addClass("green")

?這樣,div的after偽元素就是.green::after了

新加style

$("<style>.red::after{content:'green';color:green}</style>").appendTo("head")

?如需了解更多方法,敬請參見引用文章。

Pankaj Parashar—Modify pseudo element styles with JavaScript

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內容

  • 一. 緣由: 本文源于在OSC社區中,有人提問如何用jq獲取偽元素。我第一想法是強大的CSS Query應該可以獲...
    流動碼文閱讀 15,369評論 0 7
  • 問答題47 /72 常見瀏覽器兼容性問題與解決方案? 參考答案 (1)瀏覽器兼容問題一:不同瀏覽器的標簽默認的外補...
    _Yfling閱讀 13,796評論 1 92
  • 本文轉載自:眾成翻譯譯者:為之漫筆鏈接:http://www.zcfy.cc/article/239原文:http...
    極樂君閱讀 7,403評論 1 62
  • 有一次陪孩子去游樂場玩,遇見一位母親正在大聲呵斥孩子:“還傻站著干什么,趕緊說說究竟是那個熊孩子騙了你?”孩子大約...
    勿忘初心丨閱讀 395評論 2 2
  • 來到這個城市,已經快11年,經歷那么多事情,我不知道究竟是為了什么要來到這里,改變了我的人生。每當黑夜來臨,我都會...
    Jiertian閱讀 334評論 0 1