JavascriptのDOM style.backgroundColorが正しく

Question

それは次のように私の問題がある動作しません。その頭の中には、次のようなCSSコードが少しあります。

<style type='text/css'> 
.black {background-color: black;} 
.white {background-color: #ffffff;} 
td {width:50px; height:50px;} 
</style> 

JavaScriptは本文セクションにテーブルを描画します。コードを書くことは、基本的にチェス盤を描く2つのループです（for）。しかしそれは問題ではない。 td要素はすべて、適切に色付けされるクラスblackまたはwhiteを取得します。そして、tdはすべてonclick='changeBg(this)'属性を取得します。

問題が生まれる場所がここにあります。私は、クリックされた要素の背景色にアクセスできません。関数は次のようになります。

function changeBg(element) 
{ 
    alert(element.style.backgroundColor); 
    element.style.backgroundColor = "red"; 
} 

まず、現在の要素の色を警告します。それは常に空白の通知を警告します。色を赤に変えてもう一度要素をクリックすると、redが警告されます。 tdはブラウザで色付けされており、火かき棒で調べるとbackground-color: black | whiteとなります。

私は何が欠けており、これを修正する方法がありますか？私はstyle="color: black | white"を使用してそれらを作成するときにtdの色を設定すると気付きました。それは動作しますが、私はどのクラスに属するのかわかりません。

Answer 1

あなたは使用して現在適用されたスタイルを得ることができますwindow.getComputedStyleからDocs

function changeBg(element) { 
    alert(window.getComputedStyle(element).backgroundColor); 
    element.style.backgroundColor = "red"; 
}