JavaScript

超轻量级php框架startmvc

JS实现的自动打字效果示例

更新时间:2020-04-29 03:54:01 作者:startmvc
本文实例讲述了JS实现的自动打字效果。分享给大家供大家参考,具体如下:<!DOCTYPEhtml>

本文实例讲述了JS实现的自动打字效果。分享给大家供大家参考,具体如下:


<!DOCTYPE html>
<html>
 <head>
 <meta charset='utf-8'>
 <title>js typing</title>
 </head>
 <body>
 <div id='divTyping'></div>
 <script>
 var str = 'js 实现的 打字效果,感觉蛮有趣的。';
 var i = 0;
 function typing(){
 var divTyping = document.getElementById('divTyping');
 if (i <= str.length) {
 divTyping.innerHTML = str.slice(0, i++) + '_';
 setTimeout('typing()', 200);//递归调用
 }
 else{
 divTyping.innerHTML = str;//结束打字,移除 _ 光标
 }
 }
 typing();
 </script>
 </body>
</html>

运行效果图如下:

JS 自动 打字