Javascript 单击时为div指定样式

仅当单击时才将类应用于元素，您可以创建两个不同的单击函数。一个用于陷阱，另一个用于其他

为此，你需要知道哪些是安全的。请参见下面代码中的

otherDivsIds

。使用

idArray

中的filter函数查找另一个

id

，然后循环遍历它们（使用forEach或其他方法），并向每个id添加事件侦听器

我还建议“交换”变量trapBox和trapId的命名。反之亦然

请参阅下面的代码

var-idArray=['1'，'2'，'3'，'4']；
var trapBox=idArray[Math.floor（Math.random（）*idArray.length）]；
var trapId=document.getElementById（trapBox）；
trapId.addEventListener（'click'，boomClickFunction，false）；
var otherDivsIds=idArray.filter（id=>id！==trapBox）；
otherDivsIds.forEach（id=>{
safeBox=document.getElementById（id）；
safeBox.addEventListener（'click'，safeClickFunction，false）
})
var timeoutId=window.setTimeout（ticker，5000）；
函数代码（）{
document.getElementById（'timesUp'）.innerHTML=“时间到了！”；
document.body.style.backgroundColor=“黑色”；
} 
函数boomClickFunction（）{
this.classList.add（'boom'）
}
函数safeClickFunction（）{
this.classList.add（'safe'））
}

div{
宽度：20px；
高度：20px；
背景颜色：绿色；
利润率：20px；
浮动：左；
}
.轰{
背景色：红色；
}
.安全{
背景颜色：浅蓝色；
}
#timesUp{
颜色：白色；
}

---

您可以使用

classList.add（'classtobeaded'）

将类添加到元素中

在您的情况下，您可以将其放入

单击功能中：

trapId.classList.add('boom');

请编辑您的问题并包括相关的HTML。看来您已经知道如何使用js应用一些样式，为什么您没有为
点击功能实现它呢？或者问题在于将类应用于元素？是的，我试图在单击时将.boom/.safe类应用于元素