Question

我正在尝试使用.style.color更改元素的颜色，但它并不是非常顺利。我的目标是在点击时更改红色然后变为蓝色。有什么建议吗？

var turns = 0;

function dot_01() {
    if (turns === 0) {
        turns++;
        document.getElementById("dot_01").style.color = 'red';
     } else if (turns === 1) {
        turns--;
        document.getElementById("dot_01").style.color = 'blue';
    }
}

<div class="dot" id="dot_01" onclick="dot_01()"></div>

Answer 1

您想使用.style.backgroundColor更改按钮颜色。 .color将改变字体颜色。

<input type="button" value="Click Me" onclick="this.style.backgroundColor = '#000'; this.style.color = '#FFF';" />

Answer 2

如果您要更改背景颜色，请尝试style.backgroundColor，如下所示：

document.getElementById("dot_01").style.backgroundColor = 'red';
function dot_01(el) {
  if (el.style.backgroundColor === 'red') {
    el.style.backgroundColor = 'blue';   
  }
  else el.style.backgroundColor = 'red';
}

<div class="dot" id="dot_01" onclick="dot_01(this)">Container</div>

Answer 3

我使用它来改变样式，它是一个非常简单的JavaScript，可以更改CSS的显示和高度属性以显示/隐藏容器。抱歉，我还没有把它改成你想要的结果，但我希望这有帮助，只需修改它就可以改变颜色：

风格=＆＃34;颜色：红＆＃34;

https://jsfiddle.net/raydekker/u821a84d/

style="color:red";

更改颜色onClick

3 个答案: