HTML5給予我們極致的功能和體驗,其中屏幕朗讀器是一項非常實用的功能。下面是一段HTML5屏幕朗讀器的代碼。
// 給按鈕添加click事件
document.querySelector('button').addEventListener('click', () =>{
// 選中文本并讀取
let utterThis = new SpeechSynthesisUtterance(document.querySelector('#text-to-read').value);
window.speechSynthesis.speak(utterThis);
});
通過這段代碼,我們可以很方便的實現屏幕朗讀器功能。只需要通過querySelector選擇到要讀取的文本,然后通過SpeechSynthesisUtterance將其保存起來,最后使用speak方法朗讀出來。
這份代碼簡單易懂,易于實現,有著廣泛的應用場景。對于一些需要朗讀大段文本的網站或者應用來說,這是一項非常有用的功能。