Javascript:更改 z-index onclick

Question

我见过类似的问题，但不太切题。我只想做一些非常简单的事情:当单击按钮 1 时，它应该隐藏，按钮 2 应该出现；然后，当单击按钮 2 时，按钮 2 应隐藏，按钮 1 应显示。我试图通过修改 z-index 来做到这一点，但它不起作用。这是我用来执行此操作的代码:

if (attacker == player 1) {
    document.getElementById("p1-play").style.zIndex = -1;
    document.getElementById("p2-play").style.zIndex = 1;
}
else {
    document.getElementById(p2-play).style.zIndex = -1;
    document.getElementById(p1-play).style.zIndex = 1;
}

其中 p1-play 是按钮 1，p2-play 是按钮 2

Answer 1

最好使用显示:

var p1Play = document.getElementById("p1-play");
var p2Play = document.getElementById("p2-play");

if (attacker == player1) {
    p1Play.style.display = 'none';
    p2Play.style.display = 'block';
}
else {
    p1Play.style.display = 'block';
    p2Play.style.display = 'none';
}