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使用率が高く、その他の予期しない(他のjavascript)動作があります。手がかりはありますか?

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;
}

for2 番目のループに条件文がありません。を確認する必要があります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 には、ON 用と OFF 用の 2 つの「メニュー」クラスがあります (オンラインとオフラインを検出するためだけに)。javacript からの変更 (10mS レートの ajax コールバック) は完璧に機能します

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