Javascript 如何更改html5音频中的播放/按钮图像

我有音频播放器的代码。按下时，请暂停我更改播放/暂停按钮的图片。不幸的是，我的js能力不强(

// 

我已经用带有切换状态按钮的自定义音频控制（播放和暂停）实现了一个最终的工作解决方案。如果您不清楚，请询问

以下是工作解决方案和：

var yourAudio=document.getElementById（'yourAudio'），
ctrl=document.getElementById（'audioControl'），
playButton=document.getElementById（'play'），
pauseButton=document.getElementById（'pause'）；
函数toggleButton（）{
如果（playButton.style.display=='none'）{
playButton.style.display='block'；
pauseButton.style.display='none'；
}否则{
playButton.style.display='none'；
pauseButton.style.display='block'；
}
}
ctrl.onclick=函数（）{
如果（您的音频已暂停）{
yourAudio.play（）；
}否则{
暂停（）；
}
切换按钮（）；
//防止默认操作
返回false；
}；

#音频控制img{
宽度：50px；
高度：50px；
}
#停顿{
显示：无；
}

Karlen Kishmiryan提出的解决方案只有在每页有一个音频按钮的情况下才有效。

一切正常，您只需更改图像的URL，例如

图像/radioscalebutton.png

。请参阅：

<div class="onlineradio"><img src="images/Radio.jpg" alt="" />
<p><video id="yourAudio" width="0" height="0">
    <source src='http://178.219.160.126:8000/stream.mp3' type='audio/mpeg' preload="auto" />
</video> <a id="audioControl" href="#"><img src="images/radioscalebutton.png" alt="" /></a></p>
</div>
<script>// <![CDATA[
var yourAudio = document.getElementById('yourAudio'),
    ctrl = document.getElementById('audioControl');

ctrl.onclick = function () {

    // Update the Button
    var pause = ctrl.innerHTML === 'pause!';
    ctrl.innerHTML = pause ? 'pause' : 'play';

    // Update the Audio
    var method = pause ? 'pause' : 'play';
    yourAudio[method]();

    // Prevent Default Action
    return false;
};
// ]]></script>