如何在FOR循环中创建暂停或延迟？

Question

我正在一个网站上工作,我需要创建暂停或延迟.
所以,请告诉我如何创建暂停或延迟for环路javascript或jQuery

这是一个测试示例

 var s = document.getElementById("div1");
 for (i = 0; i < 10; i++) {
     s.innerHTML = s.innerHTML + i.toString();
     //create a pause of 2 seconds.
  }

Answer 1

您不能在函数中使用延迟,因为在退出函数之前,您对元素所做的更改不会显示.

使用setTimeout以后运行代码片段:

var s = document.getElementById("div1");
for (i = 0; i < 10; i++) {

  // create a closure to preserve the value of "i"
  (function(i){

    window.setTimeout(function(){
      s.innerHTML = s.innerHTML + i.toString();
    }, i * 2000);

  }(i));

}

Answer 2

var wonderfulFunction = function(i) {
   var s = document.getElementById("div1"); //you could pass this element as a parameter as well
   i = i || 0;
   if(i < 10) {
      s.innerHTML = s.innerHTML + i.toString();

      i++;
      //create a pause of 2 seconds.
      setTimeout(function() { wonderfulFunction(i) }, 2000);          
   }
}

//first call
wonderfulFunction(); //or wonderfulFunction(0);

你不能暂停javascript代码,使整个语言与事件一起工作,我提供的解决方案让你执行函数有一些延迟,但执行永远不会停止.

Answer 3

我尝试了所有一种，但我认为这段代码更好，它是非常简单的代码。

var s = document.getElementById("div1");
var i = 0;
setInterval(function () {s.innerHTML = s.innerHTML + i.toString();  i++;}, 2000);