神奇的H5语音合成

最新推荐文章于 2024-04-22 21:30:00 发布

星月I随心

最新推荐文章于 2024-04-22 21:30:00 发布

阅读量470

点赞数

分类专栏： HTML

原文链接：https://mp.weixin.qq.com/s/EhdqzecYp245vqsMaNf32A

版权

HTML 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

在网页端实现将指定的文字进行语音合成并进行播报。

使用HTML5的Speech Synthesis API就能实现简单的语音合成效果。

<input id="btn1" type="button" value="点我" onclick="test();" />
<script>
  function test() {
    const sos = `阿尤！不错哦`;
    const synth = window.speechSynthesis;
    let msg = new SpeechSynthesisUtterance(sos);
    synth.speak(msg)
  }
</script>

然后点击按钮，就会触发test方法的执行实现语音合成

这里推荐使用Chrome浏览器，因为HTML5的支持度不同