动态修改css文件中，具体的class中的个别属性值。

function setStyleSheetObjCssClassProperty(pStyleSheetObj, pSelectorText, pProperty, pValue) {
　　var pStyleSheet = pStyleSheetObj.sheet;
　　setSpecificStyleSheetCssClassProperty(pStyleSheet, pSelectorText, pProperty, pValue);
}
//修改class的属性值
//javascript方式
function setSpecificStyleSheetCssClassProperty(pStyleSheet, pSelectorText, pProperty, pValue) {
　　var rules = pStyleSheet.cssRules;
　　var rule;
　　var selectorText;
　　for (i = 0; i < rules.length; i++) {
　　　　rule = rules[i];
　　　　selectorText = rule.selectorText;
　　　　if (selectorText == null || selectorText == "") {
　　　　　　　　continue;
　　　　}
　　　　else if (selectorText === pSelectorText) {
　　　　　　　　rule.style.setProperty(pProperty, pValue);
　　　　　　　　return;
　　　　}
//else if (selectorText.indexOf(pSelectorText + ",") > 0) {
// rule.style.setProperty(pProperty, pValue);
//}
　　}
}
//修改class的属性值
//javascript方式
function setCssClassProperty(pSelectorText, pProperty, pValue) {
　　var pSheetObjs = document.styleSheets;
　　for (j = 0; j < pSheetObjs.length; j++) {
　　　　　　setSpecificStyleSheetCssClassProperty(pSheetObjs[j], pSelectorText, pProperty, pValue);
}



使用例子如下：

　　　　var sheetObj=$("#linkSource")[0];
　　　　setStyleSheetObjCssClassProperty(sheetObj,"pSelectorText","background","green");
　　　　setCssClassProperty("pSelectorText","background","green");

 修改后的效果的生命期：从修改开始直到CSS文件重新加载， 所以，如果有其他的特殊的使用的情况，相应的重新执行一次就好了。
 
//删除stylesheet中的某一个rule
function deleteRule(sheet, ruleName) {
　　for (i = 0; i < sheet.rules.length; i++) {
　　　　var rule = sheet.rules[i];
　　　　if (rule.selectorText.toLowerCase() == ruleName.toLowerCase()) {

　　　　　　if (sheet.deleteRule) {
　　　　　　　　　　sheet.deleteRule(i);
　　　　　　}
　　　　　　if (sheet.removeRule) {
　　　　　　　　　　sheet.removeRule(i);
　　　　　　}
　　　　}
　　}
}
//stylesheet中的添加一个rule
function addRule(sheet, ruleName) {
　　if (sheet.addRule) {
　　　　sheet.addRule(ruleName, null, 0);
　　}
　　if (sheet.insertRule) {
　　　　sheet.insertRule(ruleName + ' { }', 0);
　　}
}


 

 

转载于:https://www.cnblogs.com/jearay/p/4961991.html