前端js语音朗读文本

<!DOCTYPE html>
<html lang="zh"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>语音朗读</title></head><body><textarea id="textarea" rows="20" cols="70"></textarea><button onclick="reading()">朗读</button><script>function reading() {const value = document.querySelector("#textarea").value;if (!value) {return alert("填入朗读文本");}const speech = new SpeechSynthesisUtterance(value);speechSynthesis.speak(speech);speech.onstart = (e) => {console.log("开始读");}speech.onend = (e) => {console.log("读完了");}}</script></body>
</html>

在这里插入图片描述

打开你的声音听听

SpeechSynthesis实例对象属性

lang 获取并设置话语的语言
pitch 获取并设置话语的音调(值越大越尖锐,越低越低沉)
rate 获取并设置说话的速度(值越大语速越快,越小语速越慢)
text 获取并设置说话时的文本
voice 获取并设置说话的声音
volume 获取并设置说话的音量

SpeechSynthesis方法

speak() 将对应的实例添加到语音队列中
cancel() 删除队列中所有的语音.如果正在播放,则直接停止
pause()暂停语音
resume() 恢复暂停的语音
getVoices 获取支持的语言数组. 注意:必须添加在voiceschanged事件中才能生效

实例对象中的方法

onstart – 语音合成开始时候的回调
onpause – 语音合成暂停时候的回调
onresume – 语音合成重新开始时候的回调
onend – 语音合成结束时候的回调

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/210083.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

高通OTA升级非常规分区方法

高通OTA升级非常规分区方法 1. 高通LE OTA背景2. 高通LE OTA升级方案2.1 SDX12 OTA方案2.2 OTA升级TZ/RPM/Aboot OTA是一个通用述语&#xff0c;常见的解释为over the air。通过这一解释&#xff0c;OTA最开始的概念&#xff0c;是空中升级。后来&#xff0c;又衍生出了FOTA&am…

jupyter notebook 不知道密码,怎么登录解决办法

jupyter notebook 不知道密码&#xff0c;怎么登录解决办法 1、 windows下&#xff0c;打开命令行&#xff0c;输入jupyter notebook list &#xff1a; C:\Users\tom>jupyter notebook list Currently running servers: http://localhost:8888/?tokenee8bb2c28a89c8a24d…

企业软件定制开发的优势|app小程序网站搭建

企业软件定制开发的优势|app小程序网站搭建 企业软件定制开发是一种根据企业特定需求开发定制化软件的服务。相比于购买现成的软件产品&#xff0c;企业软件定制开发具有许多优势。 1.企业软件定制开发可以满足企业独特需求。每个企业都有自己独特的业务流程和需求&#xff0c;…

使用docker命令_进入容器_登录mysql服务_并执行sql语句---Docker工作笔记005

今天就用到了,不得不说用docker用到的还是少,记录一下,常用的也就这些吧. 首先执行: docker ps [root@localhost dataease-1.18.9]# docker ps CONTAINER ID IMAGE COMMAND CREATED …

代码随想录算法训练营Day 59 || 503.下一个更大元素II、42. 接雨水

503.下一个更大元素II 力扣题目链接(opens new window) 给定一个循环数组&#xff08;最后一个元素的下一个元素是数组的第一个元素&#xff09;&#xff0c;输出每个元素的下一个更大元素。数字 x 的下一个更大的元素是按数组遍历顺序&#xff0c;这个数字之后的第一个比它更…

华清远见嵌入式学习——网络编程——作业4

作业要求&#xff1a;①使用IO多路复用中的select函数实现TCP并发服务器客户端 ②使用IO多路复用中的poll函数实现TCP并发服务器的服务器端 一、 代码 #include <myhead.h>#define SERPORT 8888 //服务器端口号 #define SERIP "192.168.114.113"…

曲率半径的推导

参考文章 参考文章

ABB机 器 人 操 作 培 训

目 录 1 培训手册介绍 ---------------------------------------------2 2 系统安全与环境保护 ---------------------------------------------3 3 机器人综述 ---------------------------------------------5 4 机器人示教 --------------------------------------------12…

强化学习------贝尔曼方程

目录 前言基础知识马尔可夫决策过程 (Markov decision process, MDP)回报(Return)折扣回报(Discounted Return) State Value&#xff08;状态价值函数&#xff09;贝尔曼方程的推导贝尔曼方程的矩阵形式Action Value&#xff08;动作价值函数&#xff09;贝尔曼最优公式 前言 …

pip安装python包到指定python版本下

python -m pip install 包名1.命令行进入到指定python安装目录。比如我电脑上有python3.8也有python3.9。准备给python3.9安装指定的包

gitee推荐-PHP面试准备的资料

该内容为giee项目。PHP-Interview: 这个项目是自己准备PHP面试整理的资料。包括PHP、MySQL、Linux、计算机网络等资料。方便自己以后查阅&#xff0c;会不定期更新&#xff0c;欢迎提交pr&#xff0c;如果错误&#xff0c;请指出&#xff0c;谢谢 在线预览地址&#xff1a;Intr…

Android7.1 高通平台 修改系统默认语言

客户需求&#xff1a;修改系统默认语言为英文&#xff08;美国&#xff09; 源码位置&#xff1a;/build/tools/buildinfo.sh 只需修改 ro.product.locale的值即可&#xff0c;如下图&#xff1a;