javascript - 如何一个字母一个字母地写一个单词？

Question

一个单词是如何一个字母一个字母地写出来的。它应该会延迟出现一个又一个字母。这是代码。

var txt = 'animating text';
var current = 0;

function write(text){
   var elem = document.getElementById('target');
   if (current < text.length){
      elem.textContent = elem.textContent + text.charAt(current);
      current++;
      wait(100);
   }
}

Write(txt);

Answer 1

基本上你一次写一个字符，中间有一个超时。 Here's the fiddle.在代码下方

var text = 'Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque consequat ante sed fringilla bibendum. In quam elit, rutrum quis adipiscing id, iaculis eu ipsum. Morbi faucibus lectus at ante feugiat dignissim. In turpis turpis, placerat in fringilla eget, sodales blandit lacus. Vivamus tempor blandit mauris nec semper. Sed cursus metus sed justo cursus bibendum. Maecenas ornare sem sed lacinia auctor. Nulla sapien dolor, faucibus vitae dapibus in, commodo id est. Sed a ipsum laoreet, convallis lacus eu, hendrerit magna.';

// Variable for current position
var curr = 0;

var Write = function write(){

    // Find the target element to write to
    var elem = document.getElementById('target');

    // Append next character into the text content
    elem.textContent = elem.textContent + text.charAt(curr);

    // Update the current position
    curr++;

    // if we're not yet in the end of the string
    // we have a little (20ms) pause before we write the next character
    if (curr < text.length)
        window.setTimeout(write, 20);
};

Write(); // And of course we have to call the function