1

style属性を介して明示的に設定されたすべてのcssプロパティを見つけるにはどうすればよいですか？

4

3 に答える 3

2

「myp」という名前の要素のスタイルを取得したいとしましょう:

var stylez = document.getElementById("myp").style;
var ix;
for (ix = 0;  ix < stylez.length;  ++ix) {
    console.log(stylez.item(ix) + ": " + stylez.getPropertyValue(stylez.item(ix)));
}

ここで JSFiddleを実行すると、出力が生成されます。

font-weight: bold

クラスがフォント サイズを設定し、CSS が背景色を直接適用する場合でも、スタイル内の情報のみが出力されます。

スタイル属性テキストを読み取って自分で解析することもできますが、これは精度が低くなりますが、無効なステートメントを含めたい場合はこれが必要になります。

于 2012-10-17T02:46:11.507 に答える
1

element .style.cssTextは、elementのstyle属性のテキスト値を返します。

于 2012-10-17T03:01:08.300 に答える
0

それを行うための実際のクロスブラウザーの方法はないと思います。また、これらのプロパティに本当にアクセスする必要があるかどうか疑問に思います。ただし、要素のプロパティのプロパティを反復処理することはできstyleます。問題は、一部のブラウザーでは、styleプロパティにプロパティと「cssText」プロパティのような配列があることです。それらを明示的に削除できます ( jsfiddleを参照):

var s = document.getElementById('s');
var styles = document.getElementById('myp').style; 
var prop, value;
function CSSify(val) {
  var i, ch;
  var css = '';
  for(i = 0; i < val.length; i++) {
    ch = val.charAt(i);
    if(ch.toUpperCase() === ch) { 
      css += '-' + ch.toLowerCase();
    } else {
      css += ch;
    }
  }
  return css;
  } 
for(prop in styles) {
  value = styles[prop];
  if(typeof value === 'string' && value !== '' && prop !== 'cssText' && 
     isNaN(parseInt(prop)) ) { 
    s.innerHTML += CSSify(prop) + ': ' + value + '<br>';
    }
}​

styleただし、ブラウザーが認識しないプロパティまたはプロパティ値に関して、属性値を解釈する方法はブラウザーによって異なります。IE のバージョン間にも違いがあります。IE 9 では認識されないプロパティ名を持つプロパティが削除されますが、IE 7 では認識されないプロパティ値を持つプロパティが削除されます。また、IEは追加するようaccelerator: falseです。

于 2012-10-17T06:00:36.077 に答える