使用javascript中的图像静音/取消静音

Question

我想要显示图像而不是“取消静音”和“静音”字样。

我的HTML就是这样：

<input type="button" id="mute_unmute" value="Mute" onclick="Mute_Unmute()" />

我的剧本：

function Mute_Unmute() { 
     myAudio.muted = !myAudio.muted; 
}
function Volume_Controls() { 
     var muteAudio = document.getElementById("mute_unmute"); 
     if (myAudio.muted) { 
          muteAudio.value = "Unmute";
     } 
     else { 
          muteAudio.value = "Mute";
     } 
}

好吧，幸运的是我可以自己解决。我会把它留在这里以防万一有人需要它（顺便说一下，感谢那些没有理由给我一个-1的用户）。

我必须将<input>更改为<img>（这种方式对我来说更舒服）。但是，如果您愿意，可以尝试将输入类型更改为“图像”。

<img id="mute_unmute" src='img1.png' onclick="Mute_Unmute()"/>

我也对我的剧本进行了修改：

function Volume_Controls() { 
     var muteAudio = document.getElementById("mute_unmute");
     var image = document.getElementsByTagName("img")[0]; 
     if (myVideo.muted) { 
          muteAudio.value = false;
          image.setAttribute("src", "img2.png");
     } 
     else { 
          muteAudio.value = true;
          image.setAttribute("src", "img1.png");
     } 
}