html5语音合成speechsynthesisApi
HTML5的SpeechSynthesisAPI允许开发者在浏览器中使用语音合成技术。以下是一个简单的示例,展示如何使用SpeechSynthesisAPI来实现文本到语音的转换:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Speech Synthesis Example</title>
</head>
<body>
<textarea id="text" rows="5" cols="40">
请输入需要转换的文本。
</textarea>
<button id="speak-btn">读出文本</button>
<script>
const textToSpeech = () => {
const text = document.getElementById('text').value;
const msg = new SpeechSynthesisMessage(text);
window.speechSynthesis.speak(msg);
};
document.getElementById('speak-btn').addEventListener('click', textToSpeech);
</script>
</body>
</html>
在这个例子中,我们创建了一个textarea来允许用户输入文本,并有一个按钮来触发文本到语音的转换。当用户点击按钮时,textToSpeech
函数会被调用,它将用户输入的文本封装在一个SpeechSynthesisMessage
对象中,并通过speechSynthesis.speak
方法读出。
请注意,SpeechSynthesisAPI可能不会在所有浏览器中都被支持,因此在使用前最好检查当前浏览器是否支持此API。
评论已关闭