Javascript 如何使代码一次显示一个图像？_Javascript_Show Hide

Javascript 如何使代码一次显示一个图像？

javascript

Javascript 如何使代码一次显示一个图像？,javascript,show-hide,Javascript,Show Hide,如何使代码一次显示一个图像 <!DOCTYPE html> <html lang ="en"> <head> <title> VIS</title> <meta charset="utf-8"/> <script type="text/javascript" > function showImage(id){ if(document.getEl

如何使代码一次显示一个图像

<!DOCTYPE html>
    <html lang ="en">
    <head>
    <title> VIS</title>
    <meta charset="utf-8"/>
    <script type="text/javascript" >

    function showImage(id){
          if(document.getElementById(id).style.visibility =='visible')
             document.getElementById(id).style.visibility = 'hidden';
           else
              document.getElementById(id).style.visibility= 'visible';
        }
    </script>
    </head>
    <body>


    <div style="position: relative; visibility: visible;"> 
    <img src="http://vignette4.wikia.nocookie.net/mrmen/images/5/52/Small.gif/revision/latest?cb=20100731114437"
              alt="Pumpkins" id="Pum"/>
    <button onclick="showImage('Pum');">Pumpkins</button>
    </div>

    <div style="position: relative; visibility: visible;"> 
    <img src="http://vignette4.wikia.nocookie.net/mrmen/images/5/52/Small.gif/revision/latest?cb=20100731114437"
              alt="Pumpkins" id="Straw"/>
    <button onclick="showImage('Straw');">Strawberries</button>
    </div>

    <div style="position: relative; visibility: visible;"> 
    <img src="http://vignette4.wikia.nocookie.net/mrmen/images/5/52/Small.gif/revision/latest?cb=20100731114437"
              alt="Pumpkins" id="Ras"/>
    <button onclick="showImage('Ras');">Rasberries</button>
    </div>








    </body>

    </html>


可见光
函数showImage（id）{
if（document.getElementById（id）.style.visibility=='visible'）
document.getElementById（id）.style.visibility='hidden'；
其他的
document.getElementById（id.style.visibility='visible'；
}
南瓜
草莓
红莓

我的代码工作正常，但我希望它一次显示一个图像。当我单击其中一个图像时，它将隐藏另一个图像

使用我的代码，可以显示我想要的任意多的图像，也可以显示尽可能少的图像。我如何才能做到这一点，我可以发送多个ID作为参数吗

任何帮助都会很好。

尝试以下方法：

首先获取所有图像并将其隐藏，如果您希望在加载时显示任何特定图像，请忽略该索引。加载后，您可以尝试执行按钮操作。如果您希望在按钮上隐藏其余可见图像，请单击，然后获取可见图像并将其隐藏并显示单击的图像


可见光
南瓜
草莓
红莓
移除可见性（）；
函数showImage（id）{
移除可见性（）；
if（document.getElementById（id.style.visibility=='hidden'）
document.getElementById（id）.style.visibility='visible'；
}
函数removeVisibility（）{
var imgs=document.getElementsByTagName（'img'）；//获取所有图像
对于（变量i=0；i

您还可以使所有图像不可见，然后只显示您单击的图像。@Suchit谢谢，但这对我不起作用。@user3251123您面临的问题是什么。一个没有解释的答案总是可以通过解释您所做的而不是让读者进行视觉区分来找到实际的建议来改进。请为您所做的更改及其原因添加相关的解释。@jfriend00 ji正如您所说。好吧，我试着使用if/if-else语句。如果这是隐藏的，那么他的应该是可见的。如果是可见的，那么应该发生什么。可能是我不明白你的问题。请你详细说明。例如，我有三张图片。如果显示一个图像，则其余图像将隐藏。如果我单击另一个图像按钮，它将变为可见，其余的将隐藏。