setInterval
Summary
Evaluates an expression each time a specified number of milliseconds has elapsed.
Method of dom/Windowdom/Window
Syntax
var object = object.setInterval(/* see parameter list */);
Parameters
expression
- Data-type
- String
Variant that specifies a function pointer or string indicating the code to be executed when the specified interval has elapsed.
Passing a string as a parameter suffers the same hazards as eval(), so it is generally recommended to pass a function pointer instead.
msec
- Data-type
- String
Integer that specifies the number of milliseconds.
Note that there may be a minimum interval for this function. See setTimeout.
language
- Data-type
- String
String that specifies any one of the possible values for the LANGUAGE attribute.
Return Value
Returns an object of type DOM NodeDOM Node
Integer
Integer. Returns an identifier that cancels the timer with the clearInterval method.
Examples
This example uses the setInterval method to create a DHTML clock. A variable is assigned to the interval, and can be used as a reference to stop the interval by using the clearInterval method.
var oInterval = "";
function fnStartClock(){
oInterval = setInterval(fnDoClock,200);
}
function fnDoClock(){
// Code to display hours, minutes, and seconds.
}
window.onload = fnStartClock;
The next example demonstrates how to pass arguments to a function with setTimeout or setInterval. To do this, create an inner anonymous function to wrap the real callback function. In the new function scope, you can refer to variables declared prior to the call to setTimeout (such as div
). This structure is referred to as a “closure” in JScript
// The first example of a closure passes the variable to a named function.
function startTimer() {
var div = document.getElementById('currentTime');
setTimeout(function(){doClock(div)},200);
}
// The second example also uses a closure, by referring to an argument passed to the function.
function doClock(obj) {
setInterval(function(){obj.innerHTML=(new Date()).toLocaleString()},200);
}
This example demonstrates that more than one closure can refer to the same variable. Here, the callback function that displays the value of count
is called at a different interval than the function that updates its value.
function startCounter() {
var div = document.getElementById('counter');
var count = 0;
setInterval(function(){count++},143);
setInterval(function(){div.innerHTML=count},667);
}
Notes
Remarks
The setInterval method continuously evaluates the specified expression until the timer is removed with the clearInterval method. To pass a function as a string, be sure to append the function name with parentheses.
window.setInterval("someFunction()", 5000);
When passing a function pointer, do not include the parentheses.
window.setInterval(someFunction, 5000);
When you use the setInterval method with Introduction to DHTML Behaviors, the value of expression should be a function pointer to call a function within the HTML Component (HTC) file or a string to call a function in the primary document.
Note In Windows Internet Explorer, you cannot pass arguments to the callback function directly; however, you can simulate passing arguments by creating an anonymous closure function that references variables within scope of the call to setInterval or setTimeout. For more information, see Examples. In versions earlier than Microsoft Internet Explorer 5, the first argument of setInterval must be a string. Evaluation of the string is deferred until the specified interval elapses. As of Internet Explorer 5, the first argument of setInterval can be passed as a string or as a function pointer.
Attributions
Mozilla Developer Network : [setInterval Article]
Microsoft Developer Network: [setInterval Method Article]