图标切换（在4个可能的图标之间）

Question

我正在创建一个静音按钮，该按钮会根据音量改变其图标。目前，我已将图片的src设置为public/img/VolumeLow.svg，但是还有VolumeHigh.svg和VolumeHalf.svg。

为此，我有一个变量oldVolIcon，该变量记录上一个图标是什么，如果该图标是静音图标，它应该返回到其先前状态。但是我觉得我的变量位于错误的位置，或者没有正确返回。

预先感谢您的帮助。

document.getElementById('btnMute').addEventListener('click', function(){
    if (this.style.borderStyle == "outset"){
        this.oldVolume = document.getElementById('vol-control').value;
        this.style.borderStyle = "inset";

        var oldVolIcon = document.getElementById('volicons').src;
        document.getElementById('volicons').src = "public/img/VolumeMute.svg";

        console.log(oldVolIcon);
        document.getElementById('vol-control').value = 0;
    } else {
        console.log(oldVolIcon);
        this.style.borderStyle = "outset";
        document.getElementById('vol-control').value = this.oldVolume;
        document.getElementById('volicons').src = oldVolIcon;
    }
    setVolume.call(document.getElementById('vol-control'));
});