【js】for...ofでDOM要素を一文字ずつ加工したテキストアニメーション例 - Qiita

一文字ずつフェードインアニメーション よく見かけるテキストアニメーションのサンプルです。スクロール監視などと組み合わせていい感じに活用できそう。 See the Pen 文字アニメーション by __m-sato__ (@__m-sato__) on CodePen. サンプルコード document.addEventListener('DOMContentLoaded', function() { const el = document.querySelector('.animate-title'); const str = el.innerHTML.trim() // -> trim()メソッドで、文字列の両端の空白を削除した文字列を格納 let concatStr = ''; // -> for文でタグ付与されたものを格納する変数を用意 for(let c of str) { c =