js實現打字效果

deeply發表於2021-09-09
JS

         

<!DOCTYPE html>    <html>      <head>          <meta charset='utf-8'>          <title>js typing</title>      </head>        <body>          <div id='text'></div>            <script>              var str = 'JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果JavaScript實現打字效果';              var i = 0;                function typing(){                  var divTyping = document.getElementById('text');                  if (i <= str.length) {                      divTyping.innerHTML = str.slice(0, i++) + '_';                      setTimeout('typing()', 200);//遞迴呼叫                  }                  else{                      divTyping.innerHTML = str;//結束打字,移除 _ 游標                  }              }                typing();          </script>      </body>  </html>


來自 “ ITPUB部落格 ” ，連結：http://blog.itpub.net/1978/viewspace-2815634/，如需轉載，請註明出處，否則將追究法律責任。

相關文章