如何重置我的 document.getElementById 颜色值

Question

我正在尝试将颜色从红色更改为蓝色，但是当红色变为不变时

var colorvalue=0;
var sizevalue;
function CG()
{
    colorvalue ++;
    if (colorvalue==0)
    {
        document.getElementById("testd").style.color = "blue";
    }
    else if(colorvalue==1)
    {
        document.getElementById("testd").style.color = "red";
    }
    if(colorvalue > 1)
    {
        colorvalue = 0;
    }
}

我已经得到了答案，但我如何有更多的颜色

感谢您看到我的问题，如果您这样做，感谢您的回答

Answer 1

我编辑了一些你的代码。 试试下面

var colorvalue=0;
var sizevalue;
function CG()
{
    colorvalue ++;
    if (colorvalue % 2 == 0)
    {
        document.getElementById("testd").style.color = "blue";
    }
    else
    {
        document.getElementById("testd").style.color = "red";
    }
}

使用模运算：所以如果有余数colorvalue ，元素将是红色的。

Answer 2

另一种方法是使用 CSS，而不是使用 JavaScript 直接在元素上设置样式。

用红色初始化文本，然后使用classList打开/关闭蓝色类。

 const test = document.querySelector('.test'); const button = document.querySelector('button'); button.addEventListener('click', handleClick, false); function handleClick() { test.classList.toggle('blue'); }

 .test { color: red; } .blue { color: blue; }

 <p class="test">This is a test</p> <button>Change color</button>