JavaScript字符串的字符逐字输出

有些网页效果，可以将字符串中的字符逐字输出，类似于打字机的方式，下面就通过实例代码介绍一下如何实现此功能。

代码实例如下:

[ 其他 ] 运行代码下载代码

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.51qianduan.com/" />
<title>51前端</title> 
<style type="text/css">
#thediv{
  width:200px;
  height:30px;
  line-height:30px;
  margin:0px auto;
}
</style>
<script type="text/javascript"> 
var printStr=function(id,str){
  var index=0;
  var content="";
  var arr=null;
  var flag=null;
  var done=function(){
    arr=str.split("");
    content = content + arr[index];
    var odiv=document.getElementById(id);
    odiv.innerHTML=content;
    index = index + 1;
    if (index == arr.length) { clearInterval(flag) }
  }
  flag=setInterval(done,200);
}
window.onload=function(){
  var str="I love antzone";
  printStr("thediv",str);
}
</script> 
</head> 
<body> 
<div id="thediv"></div>
</body> 
</html>

代码描述：JavaScript 字符串字符输出。JavaScript字符串的字符逐字输出

下载全部收藏

146 194

用户评论

大牛，别默默的看了，快登录帮我点评一下吧！:) 登录 | 注册