重置 webp 动画，使其从第 1 帧开始播放，重新启动动画 webp

Question

已针对 gif 文件讨论了此问题。 以下是对 webp 文件不起作用的内容。脚本开头为，

var animatedWebpImg = document.getElementById('idOfTheWebpInsideAnImgElement');

第一次失败的尝试是，

animatedWebpImg.style.display = "none";
setTimeout(function() {  animatedWebpImg.style.display = "block";  },100);

其次，我尝试过

removeChild()

和

appendChild()

具有完全相同的逻辑，但也不起作用。

终于接近了，但没有成功，

var srcOfTheImg = animatedWebpImg.src;
animatedWebpImg.src = "";                 // empty and then back to original
animatedWebpImg.src = srcOfTheImg;

Answer 1

这就是有效的方法，

var srcOfTheImg = animatedWebpImg.src;
animatedWebpImg.src = "data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==";
setTimeout(function () {  animatedWebpImg.src = srcOfTheImg;  },100);

这意味着，我必须用透明像素（一种不可见的东西）填充它，而不是将 src 清空。

Answer 2

我知道这个主题很旧，但我尝试使用该解决方案但不能，这是我发现执行重新启动的方法。

$(myElement).html(`<img src='mySource.webp?v=${Math.random()}'/>`);