最近接了一个音频倍速播放的需求,之前没做过。所以写一篇总结用以记录这次遇到的问题和解决过程,加深记忆,也方便后续复习。

倍速播放

使用 audio.playbackRate 可以改变播放速度。

var myAudio = document.createElement('audio');
myAudio.setAttribute('src','audiofile.mp3');
myAudio.playbackRate = 0.5;

我尝试之后发现没生效。后来查到解决方案,发现对 playbackRate 属性的设置要放到 audio.load() 之后执行,否则会失效。

var myAudio = document.createElement('audio');
myAudio.setAttribute('src','audiofile.mp3');
myAudio.load();
myAudio.playbackRate = 0.5;

修改之后就可以倍速播放啦!

参考链接

  1. MDN.
  2. HTML audio基础API完全使用指南 - 张鑫旭.
  3. HTML5 Audio playbackRate 不生效的一种原因.