0

我正在尝试编写一个函数,该函数将接收要更新的 CSS 规则以及用于更新规则的 CSS,到目前为止,我有以下内容:

getCSSRule:function(getRule, newRule){
    var styles=document.styleSheets;
    for(var i=0,l=styles.length; i<l; ++i){
        var sheet=styles[i]; 

        if(sheet.title === "style"){
            var rules=sheet.cssRules;
            for(var j=0, l2=rules.length; j<l2; j++){
                var rule=rules[j];

                // SELECT APPROPRIATE RULE IN STYLESHEET
                if(getRule === rule){  

                    // LOSE IT HERE

                };
            };
        };
    };
},

到目前为止,代码有效。它查找所有样式表,按标题定位一个,然后遍历该样式表的规则。我现在遇到的问题是将 getRule(传递给函数的 CSS 规则名称)与 CSS 中的规则进行比较。我是使用 document.styleSheets 的新手,发现结构有些混乱。任何帮助是极大的赞赏。谢谢!

4

1 回答 1

2

CSS 规则没有名称。也许你的意思是selectorText?如果是这样,您可以像这样选择正确的规则:

if (getRule === rule.selectorText) {
    /* do stuff */
}

getRule是所需规则的确切选择器。在这种情况下,“精确”意味着选择器的真正精确形式。示例样式表:

.div {...}
#div {...}
div {...}
div:hover {...}

如果你想改变div类的规则,你getRule应该是.div,如果你想改变规则div.hovergetRule应该是.div:hover等等。

于 2012-10-05T21:42:01.663 回答