实现文字打字机效果显示

今天浏览网页无意间看到一个类似打字机效果，

后来百度查了查原理原来就是截取字符串，

自己试着也写了一个记录一下：

function Write(dom,speed){
   this.dom=dom;
   this.numInit=0;
   this.textInit=dom.innerHTML;
   this.speed=speed;
   this.inter();
}
Write.prototype={
   constructor:Write,
   inter(){
      const that=this;
      setInterval(function(){
         that.numInit++;
         that.dom.innerHTML=that.textInit.substr(0,that.numInit)+"__";
         that.dom.style.display="block";
         if(that.dom.innerHTML.length-1==that.textInit.length){
            that.dom.innerHTML=that.textInit;
         }
      },that.speed)
   }
}
new Write(
   document.getElementsByTagName("div")[0],//获取文字所在dom父节点
100//设置文字“打字”速度
);

 原理其实就是截取dom节点字符串，然后每隔多长时间重新截取覆盖原来的字符串，看起来就像是打字的效果一样。

如果有兴趣欢迎借鉴指正不足之处~