背景

有時候我們希望通過JS代碼控制偽類屬性, 確苦於對策
實際上可通過向document.head中添加style子元素來實現

演示

        function css(style_text) {
            var s = document.createElement('style');
            s.innerText = style_text;
            document.head.appendChild(s);
        }

        document.onclick = function() {
            // 添加新的style元素, 覆蓋原來的屬性, 從而達到修改的目的
            css("button:hover {color: red;}");
        };
 

當鼠標懸停時

點擊頁面, 添加新的偽類button:hover, 此時再次在按鈕上猶豫時, 按鈕文本顏色發生了變化

JavaScript 修改 CSS 偽類屬性