在時間間隔上循環JavaScript函數

Question

我使用JavaScript編寫腳本，可以產生打字效果。 我嘗試循環它，以便它從執行結束起10秒后循環執行。 換句話說，這是一種打字效果，當文本在十秒鍾后被寫入時，將再次執行。 我嘗試了setTimeout() ，但是沒有用。

預先感謝您的幫助。

function setupTypewriter(t) {
  var HTML = t.innerHTML;

  t.innerHTML = "";

  var cursorPosition = 0,
      tag = "",
      writingTag = false,
      tagOpen = false,
      typeSpeed = 50,
      tempTypeSpeed = 0;

  var type = function() {

    if (writingTag === true) {
      tag += HTML[cursorPosition];
    }

    if (HTML[cursorPosition] === "<") {
      tempTypeSpeed = 0;
      if (tagOpen) {
        tagOpen = false;
        writingTag = true;
      } else {
        tag = "";
        tagOpen = true;
        writingTag = true;
        tag += HTML[cursorPosition];
      }
    }
    if (!writingTag && tagOpen) {
      tag.innerHTML += HTML[cursorPosition];
    }
    if (!writingTag && !tagOpen) {
      if (HTML[cursorPosition] === " ") {
        tempTypeSpeed = 0;
      }
      else {
        tempTypeSpeed = (Math.random() * typeSpeed) + 50;
      }
      t.innerHTML += HTML[cursorPosition];
    }
    if (writingTag === true && HTML[cursorPosition] === ">") {
      tempTypeSpeed = (Math.random() * typeSpeed) + 50;
      writingTag = false;
      if (tagOpen) {
        var newSpan = document.createElement("span");
        t.appendChild(newSpan);
        newSpan.innerHTML = tag;
        tag = newSpan.firstChild;
      }
    }

    cursorPosition += 1;
    if (cursorPosition < HTML.length - 1) {
      setTimeout(type, tempTypeSpeed);
    }

  };

  return {
    type: type
  };
}

var typer = document.getElementById('typewriter');

typewriter = setupTypewriter(typewriter);

typewriter.type();

Answer 1

 typewriter = setupTypewriter(typewriter); 

您將typewriter變量傳遞給setupTypewriter ，但尚不存在。 在這里你想用

typewriter = setupTypewriter(typer);

---

順便說一句，我不明白您如何打印標簽。 您以零延遲打印< ， d ， i ， v ， > ，但解析器仍可能會中斷。 您應該立即打印標簽： <div></div> ，然后將div的內容附加到標簽上。

Answer 2

您需要setInterval。

setInterval（function（）{alert（“ Hello”）;}，3000）;

該代碼將每三秒鍾運行一次。

完整的文檔，示例等（此處包括如何停止）：

https://www.w3schools.com/jsref/met_win_setinterval.asp