如何使用JavaScript设置HTML元素的CSS背景颜色？

解决方案

回答

var element = document.getElementById('element');
element.style.background = '#FF00AA';

回答

通常，将CSS属性转换为JavaScript时可以使用驼峰形式，而无需使用任何破折号。因此，" background-color"变为" backgroundColor"。

function setColor(element, color)
{
    element.style.backgroundColor = color;
}

回答

或者，使用一些jQuery：

$('#fieldID').css('background-color', '#FF6600');

回答

如果我们将所有样式保留在CSS中，而仅在JavaScript中设置/取消设置类名，则可能会发现代码更易于维护。

CSS显然是这样的：

.highlight {
    background:#ff00aa;
}

然后在JavaScript中：

element.className = element.className === 'highlight' ? '' : 'highlight';