style.backgroundColor to pusty ciąg znaków w kodzie JavaScript

Question

Mam poniższy kod, który próbuję ustawić kolor tła. Jednak kolor tła zwraca się jako pusty ciąg. Nie jestem pewien, dlaczego ... Czy ma to coś wspólnego z typami javascript?

function function1(){ 
var color = document.getElementById('rg_vw.national_avg').style.backgroundColor; 
//this below appears as an empty alert at runtime. it's an empty string. 
alert(color) 
} 

Podobnie jak kontrola poprawności, jeśli używam właściwość „wartość”, to wypisuje prawidłową wartość danej dziedzinie ... więc jestem po prostu trochę sfrustrowany, dlaczego jest backgroundColor pusta struna.

//this works just fine 
var value = document.getElementById('rg_vw.national_avg').value 
alert(value) 

Answer 1

O ile nie określono backgroundColor bezpośrednio na samego elementu, trzeba użyć getComputedStyle() lub currentStyle aby uzyskać wartość właściwości stylu.

Metoda, która jest kompatybilna z wieloma przeglądarkami będzie wyglądać następująco:

function getStyle(el,styleProp) 
{ 
    if (el.currentStyle) 
     return el.currentStyle[styleProp]; 

    return document.defaultView.getComputedStyle(el,null)[styleProp]; 
} 

można zobaczyć przykład pracuje na jsFiddle.

Więcej informacji:

• Zobacz this page więcej informacji o getComputedStyle().
• Zobacz this page, aby uzyskać więcej informacji na temat currentStyle (IE).
• Aby uzyskać więcej informacji o problemach ze zgodnością przeglądarki, zobacz artykuł this page.