JS设置伪元素样式

JS中设置伪元素的样式

通过以下js可以选中css中的伪元素class、id等

document.styleSheets[0].insertRule('.test::before{color:green}',0)//chrome,firefox
document.styleSheets[0].addRule('.test::before{color:green}',0)// IE 浏览器

或者

var style=document.createElement('style');
style.innerHTML=".test::before{color:green}";
document.head.appendChild(style);

ivx中示例：

document.styleSheets[0].insertRule('.phone input{border-color:red !important}',0)//chrome,firefox

图1代码可在ivx中设置phone下的input的边框颜色，phone为自定义设置的额外元素类

document.styleSheets[0].insertRule('.phone input::-webkit-inner-spin-button,.phone input::-webkit-outer-spin-button{-webkit-appearance: none; margin: 0;}',0)//chrome,firefox

图2代码可在ivx中去除phone下input因类型为number而被系统附带的上下加减箭头，phone为自定义设置的额外元素类

document.styleSheets[0].insertRule('body>img:first-child{display:none}',0)//chrome,firefox

图3代码可在ivx中去除右上角的未发布提示，本质上含义是选中body下的第一个img标签元素，并对其隐藏