setInterval的持续时间

Question

我创建了一个简单的函数,它在3秒内将值从0计数到某个值.

这是小提琴 - https://jsfiddle.net/ar6akv5z/和片段:

var number = document.querySelector('.number');
var button = document.querySelector('button');

button.addEventListener('click', function() {
    counting(number, 2500);
})

function counting(elem, value) {
 var count = 0;
 var timerId = setInterval(function() {
  if (++count == value) clearInterval(timerId);
  elem.innerHTML = count;
 }, 3000/value);
}

<span class="number">0</span>
<button>Go</button>

但是功能的持续时间超过3秒.你能解释一下为什么会这样,或者告诉我我的错误.

谢谢,抱歉我的英语

Answer 1

由setTimeoutand 强制执行的最小延迟setInterval.来自MDN

延迟的原因超过指定的时间

嵌套超时强制> = 4ms

历史上,浏览器实现setTimeout()"clamp":延迟小于"最小延迟"限制的连续setTimeout()调用被强制使用至少最小延迟.最小延迟DOM_MIN_TIMEOUT_VALUE为4毫秒(存储在Firefox中的首选项:dom.min_timeout_value),DOM_CLAMP_TIMEOUT_NESTING_LEVEL为5.

实际上,HTML5规范指定了4毫秒,并且在2010年及之后发布的浏览器中保持一致.在(Firefox 5.0/Thunderbird 5.0/SeaMonkey 2.2)之前,嵌套超时的最小超时值为10 ms.

因此,即使您指定3000/2500 = 1.2为间隔时间,它也就像您用作4间隔时间一样.