Javascript 在多次单击按钮时，如何更改inner.HTML

我试图改变按钮文本和样式时，点击按钮。将“生成”按钮更改为“重置”按钮时，代码正在运行，但从“重置”按钮更改为“生成”按钮时，代码不起作用。似乎代码在第一次单击时就开始工作了。我怎样才能解决这个问题

//将“生成”按钮更改为重置#
让generateBtn=document.getElementById（“generateBtn”）；
generateBtn.addEventListener（“单击”，（）=>{
如果（（generateBtn.innerHTML=“GENERATE”））{
generateBtn.innerHTML=“重置”；
generateBtn.classList.add（“显示重置btn”）；
}否则{
generateBtn.innerHTML=“GENERATE”；
generateBtn.classList.remove（“显示resetBtn”）；
}
});
.generateBtn已显示{
背景色：红色；
颜色：#eba341；
字体大小：1.5rem；
字号：500；
边界半径：0.5雷姆；
宽度：10雷姆；
高度：3雷姆；
边界：无；
}
.resetBtn显示{
背景色：#21b884；
颜色：白色；
}
生成
//将“生成”按钮更改为重置#
让generateBtn=document.getElementById（“generateBtn”）；
generateBtn.addEventListener（“单击”，（）=>{
如果（（generateBtn.innerHTML==“GENERATE”）{/==而不是=
generateBtn.innerHTML=“重置”；
generateBtn.classList.add（“显示重置btn”）；
}否则{
generateBtn.innerHTML=“GENERATE”；
generateBtn.classList.remove（“显示resetBtn”）；
}
});
.generateBtn已显示{
背景色：红色；
颜色：#eba341；
字体大小：1.5rem；
字号：500；
边界半径：0.5雷姆；
宽度：10雷姆；
高度：3雷姆；
边界：无；
}
.resetBtn显示{
背景色：#21b884；
颜色：白色；
}
在
中生成如果
语句，则需要使用
=
而不是equals。因此，在您的情况下，需要：

if（（generateBtn.innerHTML==“GENERATE”）{

解释得很好


//将“生成”按钮更改为重置#
让generateBtn=document.getElementById（“generateBtn”）；
generateBtn.addEventListener（“单击”，（）=>{
if（（generateBtn.innerHTML==“GENERATE”））{
generateBtn.innerHTML=“重置”；
generateBtn.classList.add（“显示重置btn”）；
}否则{
generateBtn.innerHTML=“GENERATE”；
generateBtn.classList.remove（“显示resetBtn”）；
}
})；
.generateBtn已显示{
背景色：红色；
颜色：#eba341；
字体大小：1.5rem；
字号：500；
边界半径：0.5雷姆；
宽度：10雷姆；
高度：3雷姆；
边界：无；
}
.resetBtn显示{
背景色：#21b884；
颜色：白色；
}
生成
试试这个..

您应该使用
textContent
而不是innerHtml。它将从html标记中为您提供
text
。使用
includes
方法比较文本

在谷歌上搜索：
innertext
vs
innerhtml
vs
textcontent
。


让generateBtn=document.getElementById（“generateBtn”）；
generateBtn.addEventListener（“单击”，（e）=>{
if（例如target.textContent.includes（“生成”））{
e、 target.innerText=“重置”；
e、 target.classList.add（“显示resetBtn”）；
}否则{
e、 target.innerText=“生成”；
e、 target.classList.remove（“显示resetBtn”）；
}
})；
.generateBtn已显示{
背景色：红色；
颜色：#eba341；
字体大小：1.5rem；
字号：500；
边界半径：0.5雷姆；
宽度：10雷姆；
高度：3雷姆；
边界：无；
}
.resetBtn显示{
背景色：#21b884；
颜色：白色；
}
生成
在“如果”条件下，将
=
替换为
=
（或
==
）