javascript - 逐个字母显示文本

Question

使用 CSS 和 JavaScript 逐个字母(如视频游戏字幕)显示 html 文本的最优雅方式是什么？

虽然我确信他可以使用蛮力方法解决(比如，拆分字符并使用 jQuery.append() 一个一个地打印它们)，但我希望有一些 CSS3(伪元素？)或 JQuery 魔法可以更优雅地做到这一点。

如果解决方案考虑内部 HTML 内容，则加分。

Answer 1

HTML

<div id="msg"/>

Javascript

var showText = function (target, message, index, interval) {   
  if (index < message.length) {
    $(target).append(message[index++]);
    setTimeout(function () { showText(target, message, index, interval); }, interval);
  }
}

调用:

$(function () {
  showText("#msg", "Hello, World!", 0, 500);   
});