<div class="div"><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p><p>你好，世界！</p></div><div class="btn">播放</div>
需要引入jquery-1.8.1.min.js（那个版本都行）
var app = {audioOff: true,outer: $('.div p'),index: 0,//初始值msg: new SpeechSynthesisUtterance(),content: '语音播报结束',//文字内容onInit() {app.content = app.outer.eq(app.index).text();this.event();},configure() {app.msg.text = app.content;app.msg.lang = "zh-CN";//使用的语言:中文app.msg.volume = 1;//声音音量:0-1app.msg.rate = 0.8;//语速:0.1-10app.msg.pitch = 0.8;//音高:0-2app.play();},play() {console.log("语音播报");speechSynthesis.speak(app.msg);app.onend();},// 暂停stop() {speechSynthesis.stop(app.msg);},// 结束onend() {app.msg.onend = () => {console.log("语音播报结束");app.index += 1;if (app.index <= (app.outer.length - 1)) {app.content = app.outer.eq(app.index);app.outer.eq(app.index).css({'color': 'red',});app.configure();}};},// 事件event() {$('body').on('click', '.btn', function () {console.log("语音");app.configure();});}}app.onInit();
