2

不透明度の値をjavacriptに読み込みたい場合は、次を使用できます。

element.style.opacity

ただし、fontSizeが必要な場合は、以下の関数を使用する必要があります。

function findFontSize( element_id )
{
    var element = document.getElementById( element_id );  
    // var theCSSprop = element.style.fontSize; // Does not work  
    // var theCSSprop = element.getPropertyValue("font-size"); // Does not work
    var theCSSprop = window.getComputedStyle( element, null ).getPropertyValue("font-size");  // This works
    alert( theCSSprop ); 
}

関連している

http://jsfiddle.net/tUc5v/

どうしてこれなの？

4

1 に答える 1

2

明示的に定義されたcssスタイルと継承されたスタイルには異なる構文があります。不透明度が明示的に設定されていると推測していますが（jsfiddleは質問と一致しませんが）、fontSizeは継承されます。

更新：この古いコメントを見つけました、もう少しあげたいと思いました...

要素にスタイルシートまたはインラインで明示的に定義されたスタイルがない場合、その要素は、element.style.property途中でアクセスできない計算されたスタイルにフォールバックします。

もう1つの違いは、スタイルオブジェクトの明示的なスタイルはキャメルケースですが、計算されたスタイルはハイフンケースです。

もう1つの注意点は、スタイルオブジェクトを介してアクセスされるプロパティは、window.getComputedStyle（またはdocument.defaultView.getComputedStyle）よりも3倍から4倍高速であるということです。

これは、どのスタイルでもこれを実行できる基本的な関数です（誤った入力などをチェックしません）。

/**
 * 
 * @param el Element
 * @param CSS property in hyphen case 
 * @param pseudo pseudo selector (optional, e.g. '::before')
 */
function getStyleValue(el, property, pseudo) {
    // convert hyphen-case to camelCase
    const elStyle = el.style[property.replace(/(\-[a-z])/g, $1 =>  $1.toUpperCase().replace('-',''))];
    return ((elStyle !== '' && !pseudo) 
        ? elStyle
        : window.getComputedStyle(el, pseudo).getPropertyValue(property));
}
于 2012-05-12T18:17:52.460 に答える