04/5
2015
使用了js的substring()方法截取字符串,并使用定时器控制字符增加的间隔时间。代码如下:
<div class="textbox" style="text-align: center;font-family: Microsoft YaHei;"></div> <script type="text/javascript"> var textword="Darkness cannot drive out darkness; only light can do that. Hate cannot drive out hate; only love can do that."; var textbox=document.getElementsByClassName("textbox")[0]; var textlength=1; var startAdd; function textwordAdd () { textbox.innerText=textword.substring(0, textlength); if (textlength<=textword.length) { textlength++; }else{ clearInterval(startAdd); }; } startAdd=setInterval(textwordAdd, 100); </script>
定时器单独设置了一个变量。如果直接用window.setInterval和window.clearInterval的方式的话,清除定时器是无效的。
参考:JS截取字符串substr 和 substring方法
写的不错,刚才把你写的代码测试了一遍,也从头到尾理解了一遍,真心感觉前端的每一个看似简单的东西,都需要花很多时间去琢磨。var textbox=document.getElementsByClassName("textbox")[0];比如这行代码,刚开始不懂,后来自己测了几遍,才明白是设置取第一个匹配到的class(如果有多个匹配项的话)。