Javascript 在JS中使用条件改变颜色

我正在做迷你JS反项目。一切都很好，尽管我一直坚持给“0”一个特定的颜色。 到目前为止，我的代码如下

（函数（）{
常量计数器=document.querySelector（'h1'）；
const add=document.querySelector（'.increase'）；
const substract=document.querySelector（'.reduce'）；
让计数=0；
add.addEventListener（'click'，function（）{
counter.innerHTML=count++；
如果（计数>0）{
counter.classList.add（'over'）
}
})
substract.addEventListener（'click'，function（）{
counter.innerHTML=计数--；
如果（计数<0）{
counter.classList.add（'under'）
}
})
})（）

。完毕{
颜色：绿色；
}
{
颜色：红色；
}
.零{
颜色：灰色；
}

文件
0
-
+

您必须取消分配其他css类，以便始终显示正确的css类

（函数（）{
常量计数器=document.querySelector（'h1'）；
const add=document.querySelector（'.increase'）；
const substract=document.querySelector（'.reduce'）；
让计数=0；
add.addEventListener（'click'，function（）{
counter.innerHTML=++计数；
如果（计数>0）{
counter.classList.remove（'under'，'zero'）
counter.classList.add（'over'）
}
否则如果（计数==0）{
counter.classList.remove（'under'、'over'）
counter.classList.add（'zero'））
}
})
substract.addEventListener（'click'，function（）{
counter.innerHTML=--计数；
如果（计数<0）{
counter.classList.remove（'over'，'zero'））
counter.classList.add（'under'）
}
否则如果（计数==0）{
counter.classList.remove（'under'、'over'）
counter.classList.add（'zero'））
}
})
})（）

。完毕{
颜色：绿色；
}
{
颜色：红色；
}
.零{
颜色：灰色；
}

文件
0
-
+

您必须取消分配其他css类，以便始终显示正确的css类

（函数（）{
常量计数器=document.querySelector（'h1'）；
const add=document.querySelector（'.increase'）；
const substract=document.querySelector（'.reduce'）；
让计数=0；
add.addEventListener（'click'，function（）{
counter.innerHTML=++计数；
如果（计数>0）{
counter.classList.remove（'under'，'zero'）
counter.classList.add（'over'）
}
否则如果（计数==0）{
counter.classList.remove（'under'、'over'）
counter.classList.add（'zero'））
}
})
substract.addEventListener（'click'，function（）{
counter.innerHTML=--计数；
如果（计数<0）{
counter.classList.remove（'over'，'zero'））
counter.classList.add（'under'）
}
否则如果（计数==0）{
counter.classList.remove（'under'、'over'）
counter.classList.add（'zero'））
}
})
})（）

。完毕{
颜色：绿色；
}
{
颜色：红色；
}
.零{
颜色：灰色；
}

文件
0
-
+

如果需要修复：

(function () {
            const counter = document.querySelector('h1');
            const add = document.querySelector('.increase');
            const substract = document.querySelector('.decrease');
            let count = 0;

            add.addEventListener('click', function () {
                count++;
                counter.innerHTML = count
                if (count > 0) {
                    counter.classList.add('over');
                    counter.classList.remove('under')
                } else if(count === 0) {
                    counter.classList.remove('under')
                    counter.classList.remove('over')
                }
            })


            substract.addEventListener('click', function () {
                count--;
                counter.innerHTML = count
                if (count < 0) {
                    counter.classList.add('under')
                    counter.classList.remove('over')
                } else if(count === 0) {
                    counter.classList.remove('under')
                    counter.classList.remove('over')
                }
            })
        })()

（函数（）{
常量计数器=document.querySelector（'h1'）；
const add=document.querySelector（'.increase'）；
const substract=document.querySelector（'.reduce'）；
让计数=0；
add.addEventListener（'click'，函数（）{
计数++；
counter.innerHTML=count
如果（计数>0）{
counter.classList.add（'over'）；
counter.classList.remove（'under'）
}否则如果（计数===0）{
counter.classList.remove（'under'）
counter.classList.remove（'over'）
}
})
substract.addEventListener（'click'，函数（）{
计数--；
counter.innerHTML=count
如果（计数<0）{
counter.classList.add（'under'）
counter.classList.remove（'over'）
}否则如果（计数===0）{
counter.classList.remove（'under'）
counter.classList.remove（'over'）
}
})
})()

如果需要修复：

(function () {
            const counter = document.querySelector('h1');
            const add = document.querySelector('.increase');
            const substract = document.querySelector('.decrease');
            let count = 0;

            add.addEventListener('click', function () {
                count++;
                counter.innerHTML = count
                if (count > 0) {
                    counter.classList.add('over');
                    counter.classList.remove('under')
                } else if(count === 0) {
                    counter.classList.remove('under')
                    counter.classList.remove('over')
                }
            })


            substract.addEventListener('click', function () {
                count--;
                counter.innerHTML = count
                if (count < 0) {
                    counter.classList.add('under')
                    counter.classList.remove('over')
                } else if(count === 0) {
                    counter.classList.remove('under')
                    counter.classList.remove('over')
                }
            })
        })()

（函数（）{
常量计数器=document.querySelector（'h1'）；
const add=document.querySelector（'.increase'）；
const substract=document.querySelector（'.reduce'）；
让计数=0；
add.addEventListener（'click'，函数（）{
计数++；
counter.innerHTML=count
如果（计数>0）{
counter.classList.add（'over'）；
counter.classList.remove（'under'）
}否则如果（计数===0）{
counter.classList.remove（'under'）
counter.classList.remove（'over'）
}
})
substract.addEventListener（'click'，函数（）{
计数--；
counter.innerHTML=count
如果（计数<0）{
counter.classList.add（'under'）
counter.classList.remove（'over'）
}否则如果（计数===0）{
counter.classList.remove（'under'）
counter.classList.remove（'over'）
}
})
})()

除了向

元素添加特定类之外，还必须删除其他类（例如：

counter.classList.remove（'over'、'under'、'zero'）

）。除了向

元素添加特定类之外，还必须删除其他类（例如：

counter.classList.remove（'over'、'under'、'zero'）

）。