Javascript'i kullanarak, üzerine tıkladığımda tablo hücresinin arka plan rengini nasıl alabilirim?

Question

Tıkladığımda bir tablo hücresinin arka planını gösteren bir uyarı penceresi açılmasını istiyorum. Arka plan rengini nasıl yakalayacağımı ya da anlamaya çalıştığımı göremiyorum.

Benim tablo hücresi şöyle görünür:

<td id="s0" onclick="selectCell(event)">0</td> 

Benim selectCell fonksiyonu şöyle görünür:

Benim CSS şöyle

function selectCell(e){ 
    alert(e.target.backgroundColor); //this gives me 'undefined' 
    alert(e.target.bgcolor);   //this gives me 'undefined' 
    alert(e.target.bgColor);   //nothing shows up. i don't believe this is a valid property 
    //once i know i am properly grabbing the color i will do stuff with it here. 
} 

:

#s0 { 
    border: 1px solid; 
    background-color: yellow; 
} 

Herhangi bir yardım büyük olacak takdir !! Bir düğümün

Answer 1

stilleri, örneğin stilleri özelliğinde şunlardır:

e.target.style.backgroundColor; 

Ancak bu sıralı style niteliğiyle bildirilen bu stilleri için çalışır. CSS bir stil kullanılarak (olması gerektiği gibi) atanmışsa, kullanmak gerekir:

window.getComputedStyle(e.target, null).backgroundColor; 

Internet Explorer maalesef yerine currentStyle (zihin sunan getComputedStyle() seçeneğini uygulamıyor, onlar değil' t, e.target ya da bence, en azından 8'den önceki sürümlerde?). Ben test etmek Internet Explorer yok, ama dokümanlar o kullanılması gerektiğini önermek:

var e = window.event ? window.event : e, 
    elementNode = e.target !== null ? e.target : e.srcElement; 
elementNode.currentStyle.backgroundColor; 

Referanslar:

• currentStyle.
• Element.style.
• window.getComputedStyle().

Answer 2

Sen Daha fazla ayrıntı için kolayca jQuery css() fonksiyonu

jQuery(document).ready(function(){ 
    $(this).click(function() { 
      var color = $(this).css("background-color"); 
      alert(color); 
    }); 
}); 

tarafından yapabiliriz

var this Örneğin bir göz