语音api实现对html内容的朗读"/>
JS利用百度语音api实现对html内容的朗读
相信很多站长都很想在自己的网页里加入朗读功能,实现自制留言板的内容朗读。接下来将会告诉大家最好的解决方法:用百度语音api
先看看代码:
function voice(str){var url = "=zh&ie=UTF-8&spd=5&text=" + encodeURI(str);var n = new Audio(url); n.src = url;n.play();
}
voice("Good Bye World!");
大家看完代码后肯定开始迫不及待地“Ctrl+C”了,但很快就发现它会把html的标签也朗读出来,因此以下就是解决办法:
bm=bm.replace(/<[^>]*>|/g,"");
//这样就会过滤html的所有标签
完整示例:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>JS利用百度语音api实现对html内容的朗读</title>
<script>
function voice(str){var url = "=zh&ie=UTF-8&spd=5&text=" + encodeURI(str);var n = new Audio(url);n.src = url;n.play();
}
function readart(){bm=document.getElementById('art_main').innerHTML;bm=bm.replace(/<[^>]*>|/g,"");voice(bm);
}
</script>
</head>
<body>
<div id="art_main"><!--留言内容-->例子:<br>你好<b>哈哈哈</b><h1>再见,世界</h1>
</div>
<a href="javascript:readart();">朗读</a>
</body>
</html>
作者亲测有效
注意,由于朗读api不是本地的,因此必须要联网使用
更多推荐
JS利用百度语音api实现对html内容的朗读
发布评论