テキストを変更してアニメーション化するにはどうすればよいですか？

Question

私は現在、いくつかの基本的なjavascriptと共にいくつかのhtmlとcssを練習しています。 私のような期間の後に変更したテキストにしたい：

私こんにちは私

IIこんにちはII

IIIこんにちはIII

またはそのような何かを、あなたのアイデアを得ます。 半分のような小さな期間の後に変更したいです。インターネットとstackoverflowを検索した後、まだ解決策が見つかりませんでした。 誰かが私にそれを正しく行う方法を指示できますか？

Answer 1

使用したsetIntervalとそれを行うための機能以下：

var el = document.getElementById("foo"); 
 
var countOfI = 1; 
 
setInterval(function() { 
 
    if (countOfI > 10) countOfI = 1; 
 
    var i = new Array(countOfI).fill('i').join(""); 
 
    el.innerHTML = i + " Hello " + i; 
 
    countOfI++; 
 
}, 500)

<div id="foo"></div>