//文字依次出來效果
$.fn.autotype = function() {
    var $text = $(this);
    // console.log(‘this‘, this);
    var str = $text.html(); //返回被選 元素的內容
    var index = 0;
    var x = $text.html(‘‘);
    //$text.html()和$(this).html(‘‘)有區別
    var timer = setInterval(function() {
        //substr(index, 1) 方法在字符串中抽取從index下標開始的一個的字符
 

        var current = str.substr(index, 1);
        if (current == ‘<‘) {
            //indexOf() 方法返回">"在字符串中首次出現的位置。
            index = str.indexOf(‘>‘, index) + 1;
        } else {
            index++;
        }
        //console.log(["0到index下標下的字符",str.substring(0, index)],["符號",index & 1 ? ‘_‘: ‘‘]);
 

        //substring() 方法用於提取字符串中介於兩個指定下標之間的字符
        $text.html(str.substring(0, index) + (index & 1 ? ‘‘: ‘‘));
        if (index >= str.length) {
            clearInterval(timer);
        }
    },
    100);
}

$(‘.font‘).autoplay();

//文字依次出來效果,這種方法可行，但流程步驟一多容易混亂
  var con  = $(".fontx");         
  
 
var index = 0;  
  var tid = null;  

  function start(s){ 
  var len = s.length;  
      con.text(‘‘);  
      tid = setInterval(function(){  
          con.append(s.charAt(index));  
          if(index ++ === len){  
              clearInterval(tid);  
              index = 0;  
          }  
      },100);  
  }

start(str)

js打字效果