Javascript仅将EventListener以不同的方式添加到父样式（父样式和子样式）

当前有一个控制元素宽度和背景色的div。该div有一个子div，其内容是半透明的。这就是为什么我需要第一个div。所以背景是坚实的

现在，我向父级添加了一个事件侦听器，它扩展了一个事件侦听器的宽度，并减小了另两个事件侦听器的宽度，以便它们都适合。但是，当我单击父div时，我希望该特定div的子div添加一个类，并从其他2个div中删除一个类。我似乎不明白。这是密码。很抱歉，如果我的格式很差，第一次在堆栈溢出上发布，我已经在谷歌搜索了所有内容，似乎找不到答案

var purchaseStepCont=document.queryselectoral（“.step容器”）；
var purchaseStep=document.queryselectoral（“.step”）；
对于（变量i=0；i

1
话
wods

1
话
wods

1
话
wods

你很接近了。但是，如果要将类添加到

.step

，则需要

this.firstElementChild.classList.add（…）

而不是

this.classList.add（…）

（因为

this

将是

.step容器，而不是
.step
；但是
.step
是它的第一个子元素）。或者，为了获得更大的标记灵活性，您可以使用
this.querySelector（“.step”）

您也可以只使用单个事件处理程序函数，而不是在循环中重新创建它：


var purchaseStepCont=document.queryselectoral（“.step容器”）；
var purchaseStep=document.queryselectoral（“.step”）；
函数clickHandler（）{
var thistep=this.firstElementChild；//或者this.querySelector（“.step”）更灵活
对于（变量i=0；i

.step接触式{
颜色：蓝色；
}
.步骤性挫伤{
颜色：#ddd；
}

1
话
wods

1
话
wods

1
话
wods

当您提问时，文本区右侧有一个大橙色的“如何设置格式”框，其中包含有用的信息。还有一个完整的格式化工具条。还有一个[？]按钮提供格式化帮助。还有一个预览区，位于文本区和“发布你的问题”按钮之间（这样你就必须滚动过去才能找到按钮，以鼓励你查看），显示你的帖子发布时的样子。把你的帖子说清楚，并证明你花了时间这样做，可以提高你得到好答案的机会。