Javascript 如何从三张图片中选择一张？其余的必须是隐形的

我在做游戏。您可以从三个bokser中选择一个作为您自己的bokser。你可以选择敌人，也可以选择三个形象中的一个。在你选择了自己的博克斯和敌人之后。两个图像都必须可见，其余的则不可见

这是我的HTML

<div id="jouwbokser">
<h1>Kies Jouw Bokser!</h1>
<img id="bokser1" src="img/bokser1.png" alt="bokser" /><!--Bron:proksa.pl-->
<img id="boker2" src="img/bokser2.png" alt="bokser2" /><!--Bron:www.weekendowo.pl-->
<img id="bokser3" src="img/bokser3.png" alt="bokser3" /><!--Bron:www.ufc.com-->

</div>


<div id="computer">
<h1>Kies je Tegenstander</h1>
<img id="bokser4" src="img/bokser1.png" alt="bokser" /><!--Bron:proksa.pl-->
<img id="bokser5" src="img/bokser2.png" alt="bokser2" /><!--Bron:www.weekendowo.pl-->
<img id="bokser6" src="img/bokser3.png" alt="bokser3" /><!--Bron:www.ufc.com-->

</div>

Kies Jouw Bokser！
我是特根斯坦德

有人知道怎么做吗

---

如何做到这一点有很多方法。这一切都取决于您的需求、环境、浏览器支持等等

例如，使用jQuery：

$("img").on("click", function() {
    var $this = $(this);
    var $div = $this.parent();
    $div.addClass("has-selected");
    $("img", $div).removeClass("selected");
    $this.addClass("selected");
});

CSS:

更新

非jQuery解决方案：

var onclickImg = function(event) {
    var img = event.target;
    var div = img.parentElement;
    for (var i = 0; i < div.children.length; i++) {
        var child = div.children[i];
        if (child.nodeName != "IMG") {
            continue;
        }
        child.className = "";        
    }
    div.className = "has-selected";
    img.className = "selected";
}

imgs = document.getElementsByTagName('img');
for (var i = 0; i < imgs.length; i++) {
    imgs[i].addEventListener('click', onclickImg);
}

var onclickImg=函数（事件）{
var img=event.target；
var div=img.parentElement；
对于（变量i=0；i

---

我是说拳击手，作为一名拳击手，你尝试过什么？你的小提琴没有javascript代码。因为我不知道如何开始……游戏是全部用javascript，还是涉及服务器端代码？老实说，代码必须是javascript，你能用javascript编写吗？它必须有一个if/else声明……非常感谢

var onclickImg = function(event) {
    var img = event.target;
    var div = img.parentElement;
    for (var i = 0; i < div.children.length; i++) {
        var child = div.children[i];
        if (child.nodeName != "IMG") {
            continue;
        }
        child.className = "";        
    }
    div.className = "has-selected";
    img.className = "selected";
}

imgs = document.getElementsByTagName('img');
for (var i = 0; i < imgs.length; i++) {
    imgs[i].addEventListener('click', onclickImg);
}