首页 > 编程 > JavaScript > 正文

JavaScript实现简单的文本逐字打印效果示例

2019-11-19 14:01:44
字体:
来源:转载
供稿:网友

本文实例讲述了JavaScript实现简单的文本逐字打印效果。分享给大家供大家参考,具体如下:

先来看看运行效果:

具体代码如下:

<!DOCTYPE><html><head><title>www.VeVB.COm js打字效果</title><meta charset="utf-8"></head><style type="text/css">div {  width:980px;  margin:10px auto;  background:#F3E6EA;  border:2px outset #f9c6aa;  color:green;}</style><script type="text/javascript">var i=1;function write(){  var id=document.getElementById("main");  var msg="JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可JS打字机效果 ,原理很简单:每次多获取一个待打出的字符串的值,输出,覆盖原来输出的内容即可";  var len=msg.length;  var msg1=msg.substring(0,i);  id.innerHTML=msg1;  if(i==len){clearInterval(t)}  else    i++;}function time1(){  var t=setInterval(function(){write()},50);}</script><body onload=time1()><div id="main"></div></body></html>

更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript运动效果与技巧汇总》、《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结

希望本文所述对大家JavaScript程序设计有所帮助。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表