Javascript addEventListener（）单击执行不正确

我是javascript新手，并使用提示制作了一个小游戏。我正在构建一个UI并逐步取消提示。现在我有一个主菜单和一个战斗菜单。按“战斗”将进入“战斗”菜单，其中包含一系列动作。按了战斗菜单中的“ORA”后，应该会出现一个提示，说明攻击情况，然后将您带回主菜单

当这种情况确实发生时，当您返回主菜单时，它的行为就好像它仍然在攻击菜单中一样

document.getElementById（“战斗”）
var fightMenu=fight.addEventListener（“单击”，fightMenuFunction）
函数fightMenuFunction（）{
document.getElementById（“战斗”）.id=“ora”；
document.getElementById（“ora”）.innerHTML=“
ora
”；
document.getElementById（“status”）.id=“生气”；
document.getElementById（“get_angry”）.innerHTML=“
get angry
”；
document.getElementById（“blank1”）.id=“yell_dio”；
document.getElementById（“yell_dio”）.innerHTML=“
yell dio
”；
document.getElementById（“blank2”）.innerHTML=“
”；
var menuReturn=函数（）{
document.getElementById（“ora”）.id=“战斗”；
document.getElementById（“fight”）.innerHTML=“
fight
”；
document.getElementById（“生气”）.id=“状态”；
document.getElementById（“status”）.innerHTML=“
status
”
document.getElementById（“yell_dio”）.id=“blank1”；
document.getElementById（“blank1”）.innerHTML=“
blank1
”
document.getElementById（“blank2”）.innerHTML=“
blank2
”
}
document.getElementById（“ora”）.addEventListener（“单击”，函数）（）{
menuReturn（）；
var oraoratack=Math.random（）；
如果（oraattack>=0.4&&buff==0）{
所有损伤（20）；
}否则如果（oraattack>=0.4&&buff>=1）{
所有损伤（40）；
}否则{
确认（“您的攻击未命中！”）
enemybattleSystem（）；
}
});
document.getElementById（“get_Anger”）.addEventListener（“单击”，函数（）{
确认（“它工作了！”）；
});
document.getElementById（“yell_dio”）.addEventListener（“单击”，函数（）{
确认（“它工作了！”）；
});
}

来自

及

我们可以看到您一直在使用同一个元素，因此除非您清除事件侦听器，否则您将触发它们，无论当前id是什么。（因为事件绑定到元素，而不是id）

---

不过，您可能应该使用两个元素

是的，在使用removeChild（）和createElement（）删除和添加div元素后，我得到了我想要的菜单，谢谢。

function fightMenuFunction() {
  document.getElementById("fight").id = "ora";

var menuReturn = function() {
    document.getElementById("ora").id = "fight";