0

我使用一些函数在运行时获取特定的 css 规则

function getCSSRule(ruleName) {
var stylesheets = document.styleSheets;
for (var i=0; i < stylesheets.length; i++) {
    var rules = stylesheets[i].cssRules || stylesheets[i].rules;
    for (var j=0, rule; rule = rules[j++]; ) {
        if (rule.selectorText === '#title') {
            return rule;
        }
    }
}   
return false;
}

并在 ajax 回调中像这样使用

var r = document.getElementsByClassName('#title')[0];
r.style.background = col;

它使我的 cpu 使用率达到 100%。问题是当我尝试设置颜色时,而不是函数本身(?)任何建议将不胜感激。问题在 Chrome 中,在 FF 中没有问题,即使在 IE6 中也很好用。

简单地说,这在 Chrom 中工作,但 CPU 使用率很高,还有一些其他意想不到的(其他 javascripts)行为。有什么线索吗?

var r = document.styleSheets[0].cssRules[10]; // acess by hand

r.style.border = "auto"; // modify something
4

2 回答 2

1
function getCSSRule(ruleName) {
    var stylesheets = document.styleSheets;
    for (var i=0; i < stylesheets.length; i++) {
        var rules = stylesheets[i].cssRules || stylesheets[i].rules;
        for (var j=0, k=rules.length, rule; j < k; rule = rules[j++]; ) {
            if (rule.selectorText === '#title') {
                return rule;
            }
        }
    }   
    return false;
}

第二个for循环中缺少条件语句。您需要检查rules.length.

于 2013-04-06T21:27:50.237 回答
0

拔掉头发后,我找到了另一个解决方案,非常简单且跨浏览器。万一有人需要:)

<div id="menu" class="menu">
<a href="config.htm">Configuration</a>
<a href="status.htm">Status</a>
...
</div>

现在在 css 中,有 2 个“菜单”类,一个用于 ON,一个用于 OFF(仅用于检测在线和离线)。并且从 javacript 更改(以 10 毫秒速率 ajax 回调)效果完美

if(Offline)
{   
  var elem = document.getElementById('menu');
elem.className = 'menudis';
}
于 2013-04-06T23:54:46.317 回答