Question

我在JavaScript中计算从0到100的值，但整个计数应该需要3秒才能达到0到100.但是现在它的发生时间是毫秒。

我该怎么做？

<span><span id="counter"> </span> of 100 files</span>


        <script>
            for(var i=0;i<=100;i++)
            {       
                setTimeout(document.getElementById("counter").innerHTML = i, 3000);
            }
        </script>

示例：

http://www.downgraf.com/wp-content/uploads/2014/09/03-yodaloader.gif

Answer 1

我猜你的意思是在3秒内从1到100，这是一个例子：

var i = 0;

var inv = setInterval(function() {     
    if(i < 100)
        document.getElementById("counter").innerHTML = ++i;
    else
        clearInterval(inv);
}, 3000 / 100);

这使得整个增量大约需要3秒。它是通过设置一个间隔（前缀）增加全局变量i并每隔0.03秒设置为innerHTML来实现的。然后在达到100后清除间隔。您可以根据自己的喜好修改步长，速度和界限。以下是JSFiddle的示例。

如何为JavaScript计数器设置动画

1 个答案: