JavaScript 对象

JavaScript 参考手册

JS DOM参考手册

Window setInterval() 方法

JavaScript Window 对象

setInterval()方法重复调用一个函数或执行一个代码段，每次调用之间有固定的时间延迟。

setInterval()方法会持续调用指定的函数或代码，直到调用clearInterval()方法或关闭窗口才会停止执行。

该方法返回一个唯一标识该间隔的间隔ID，因此您以后可以通过调用clearInterval()将其删除。

要在指定的毫秒数内仅执行一次函数，请使用setTimeout()方法。

语法：

window.setInterval(function, delay, param1, param2, ...)
setInterval(function(){ alert("Hello World"); }, 2000);
测试看看‹/›

浏览器兼容性

表格中的数字指定了完全支持setInterval()方法的第一个浏览器版本：

Method
setInterval()11414

参数值

参数描述
function（必需）每delay (延迟)毫秒执行一次函数
delay（必需）计时器应以毫秒为单位（1000 ms = 1秒），在指定函数或代码的执行之间延迟。如果该值小于10，则使用值10
param1, param2, ...（可选）传递给该function(函数)其他参数  （IE9和更早版本中不支持）

技术细节

返回值：一个数字，表示设置的计时器的间隔ID值。将此值与clearInterval()方法一起使用可取消计时器

更多实例

此示例引用外部“命名”函数：

var intervalID;

function myFunc() {
  intervalID = setInterval(myCallback, 2000);
}

function myCallback() {
  alert("Hello World");
}
测试看看‹/›

显示当前时间（就像数字手表一样，每1秒钟执行一次“ startTimer()”函数）：

var intervalID = setInterval(startTimer, 1000);

function startTimer() {
   var date = new Date();
   var x = document.getElementById("result");
   x.innerHTML = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
}
测试看看‹/›

在上一个示例中，使用clearInterval()来停止时间：

var intervalID = setInterval(startTimer, 1000);

function startTimer() {
   var date = new Date();
   var x = document.getElementById("result");
   x.innerHTML = date.getHours() + ":" + date.getMinutes() + ":" + date.getSeconds();
}

function stopTimer() {
   clearInterval(intervalID);
}
测试看看‹/›

每200毫秒一次在两种背景颜色之间切换，直到由clearInterval()将其停止：

var t = setInterval(setColor, 200);

function setColor() {
   var x = document.body;
   x.style.backgroundColor = (x.style.backgroundColor == "coral") ? "lightgreen" : "coral";
}

function stopColor() {
   clearInterval(t);
}
测试看看‹/›

使用setInterval()和clearInterval()创建动态进度条：

var i = 0;
var bar = document.getElementById("progress-bar");
var t;

function start() {
  t = setInterval(progress, 60);
}

function progress() {
  if(i < 100) {
 i++;
 bar.style.width = i + "%";
 bar.innerHTML = i + " %";
  } else {
 clearInterval(t);
  }
}

function stop() {
  clearInterval(t);
}
测试看看‹/›

将参数传递给myFunc函数（在IE9和更早版本中不起作用）：

var intervalID = setInterval(myFunc, 2000, "First", "Second", "Third");
测试看看‹/›

但是，如果您使用匿名函数，它将在所有浏览器中运行：

var intervalID = setInterval(function(){ myFunc("First", "Second", "Third"); }, 2000);
测试看看‹/›

相关参考

窗口(Window)参考：clearInterval()方法

窗口(Window)参考：setTimeout()方法

窗口(Window)参考：clearTimeout()方法

JavaScript Window 对象

JS Storage 对象JavaScript Window 对象

友情链接： json在线解析 通晓查询 糯晒黄历 姓名打分