修复Vuetify与element-ui混用后,重置了button颜色,导致element的button失效

1,770 阅读1分钟

问题

定位

解决方案

// 修复vuetify 因为加上reset.css导致element-ui的button颜色出错
var sheets = document.styleSheets; 
for (var thisSheet=0;thisSheet<sheets.length;thisSheet++){
    let removeText=`button, [type="button"], [type="reset"], [type="submit"], [role="button"]`
    let sheet=sheets[thisSheet]
    try{
        if (sheet.cssRules) { // all browsers, except IE before version 9
            for (var i=0; i<sheet.cssRules.length; i++) {
                if (sheet.cssRules[i].selectorText === removeText) {
                    sheet.deleteRule (i);
                }
            }  
        }
        else 
        {  // Internet Explorer before version 9
            for (var i=0; i<sheet.rules.length; i++) {
                if (sheet.rules[i].selectorText === removeText) {
                    sheet.removeRule (i);
                }
            } 
        }
    }catch(e){}
}

参考文章

Remove CSS rules by JavaScript

javascript - 我可以以编程方式遍历CSS样式表吗?