Javascript DOM style.backgroundColor 无法正常工作答案

【问题标题】：Javascript DOM style.backgroundColor not working properlyJavascript DOM style.backgroundColor 无法正常工作
【发布时间】：2012-12-18 16:50:41
【问题描述】：

我的问题如下：

我有一段 javascript 代码，它使用document.write 生成一个“新”文档，首先我编写了网页的整个标题。在那个脑袋里，我有一些看起来像这样的 CSS 代码：

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

而 javascript 在正文部分绘制了一个表格。编写代码基本上是两个for 循环绘制棋盘。但这甚至不重要。每个td 元素都有一个black 或white 类，通过它可以正确着色。每个td 都有一个onclick='changeBg(this)' 属性。

这就是问题出现的地方。我无法访问被点击元素的背景颜色。函数如下所示：

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

首先我提醒当前元素的颜色。它总是提醒空白通知。在我将颜色更改为红色并再次单击元素后，它会提醒red。 td's 在浏览器中是彩色的，如果我用萤火虫检查它们有background-color: black | white;

我缺少什么以及如何解决这个问题？我已经意识到，如果我在使用style="color: black | white" 创建它们时设置td 颜色；它有效，但我不知道它们属于哪个类。

【问题讨论】：

标签： javascript html dom javascript-events onclick

【解决方案1】：

您可以使用window.getComputedStyle - Docs 获取当前应用的样式

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

【讨论】：