Simple JavaScript to show quote character by character [with samples]

この記事は約2分で読めます。

JavaScript to show text character by character like following.

Here is the source code.

<html lang="ja">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
  <meta http-equiv="Content-Script-Type" content="text/javascript">
  <title>Quote one by one</title>
<script type="text/javascript">
   var str = "Our greatest glory is not in never failing, but in rising up every time we fail.";
   var i=0;

   function char_one(){
     document.getElementById("char").innerHTML = str.substring(0, i++);
// substring() can retrieve characters in position 0 and the one in position "i".
//Example, if "i" is 5, str.substring(0, 5) will be "Our g" to show.

       if (i <= str.length){
          setTimeout("char_one();", 100);
//setTimeout() proceeds "char_one();" in repetition speed "100".
       } 
   }
</script>
</head>

<body onload="char_one();">
  <h1 id= "char"></h1>
</body>
</html>
タイトルとURLをコピーしました