1 
.test
{
 color:Red;
 width: 100px;
}

   var r = document.styleSheets[index].rules;   

   r[0].selectorText => Here we get ".test";

ここで、配列内のすべての .test プロパティ (この場合は色と幅) とその値 (この場合は Red & 100px ) にアクセスしたいと考えています。どうすればこれを行うことができますか?

4

2 に答える 2

3

CSSStyleRule.cssTextの が必要です。console.log(document.styleSheets[2])(これは、このページで、Chrome または Firebug のコンソールの項目を調べて、自分で見つけることができます。)

また.rules、一部のブラウザでは機能しますが、DOM レベル 2 CSS バインディングは.cssRules.

編集: 個々のスタイルにアクセスする必要がある場合は、.styleプロパティを使用してください。繰り返しますが、これが開発者コンソールを使用したかどうかを確認できます。

var sheet = document.styleSheets[2];
var rules = sheet.cssRules[1];
console.log( rules ); // Lots of properties
console.log( Object.keys(rules) );
// ["parentRule", "cssText", "type", "selectorText", "style", "parentStyleSheet"]
console.log( rules.style.display ); // "none"

このルールで適用されているスタイルだけを表示したい場合は、.styleコレクションのプロパティ (明示的に設定されていないプロパティを含む) を反復処理して空の値をチェックするか、またはcssText を自分で解析します。

于 2012-04-27T16:34:29.460 に答える
-1

jQuery はこれを簡単にします。

$('.test').each(function(){
    var curColor = $(this).css('color');
    // etc
});
于 2012-04-27T16:30:51.273 に答える