Use of settimeout and setinterval
Both of these methods can be used to implement JavaScript after a fixed time period. But each has its own application scenario.
Method
In fact, settimeout and setinterval have the same syntax. They all have two parameters, one is the code string to execute, and one is the time interval in milliseconds, and the code executes after that time period.
However, the two functions are still different, setinterval after the execution of the code, after the fixed time interval, it will also automatically repeat the code, and settimeout only one time to execute the code.
Although it appears that settimeout can only be applied to actions in On-off mode, it is possible to repeatedly invoke settimeout by creating a function loop for repeated operations:
File:settimeout_setinterval.js
ShowTime ();
function ShowTime ()
{
var today = new Date ();
Alert ("The time is:" + today.tostring ());
SetTimeout ("ShowTime ()", 5000);
}
Once this function is called, the time is displayed every 5 seconds. If you use SetInterval, the corresponding code is as follows:
File:settimeout_setinterval2.js
SetInterval ("ShowTime ()", 5000);
function ShowTime ()
{
var today = new Date ();
Alert ("The time is:" + today.tostring ());
}
The two methods may look very similar, and the results shown will be much the same, but the big difference is that the SetTimeout method does not execute the Showtime function every 5 seconds, and it executes the Showtime function 5 seconds after each call to settimeout. This means that if the body part of the Showtime function takes 2 seconds to execute, the entire function is executed every 7 seconds. But setinterval is not bound by the function that he calls, it simply repeats the function once every time.
If it is required to perform an action precisely after every fixed interval, it is best to use setinterval, and if you do not want to cause mutual interference with successive calls, especially if the call of a function requires heavy computation and long processing time, then it is best to use settimeout.
Discussion
If the timer function is not processed, then SetInterval will continue to execute the same code until the browser window closes, or the user goes to another page. However, there are ways to terminate the execution of the settimeout and setinterval functions.
When the setinterval call executes, it returns a timer ID that can be used to access the timer in the future and, if passed to Clearinterval, terminates the execution of the called procedure Code, implemented as follows:
File:settimeout_setinterval3.js (excerpt)
var intervalprocess = setinterval ("alert (' goal! ')", 3000);
var stopgoallink = document.getElementById ("Stopgoallink");
Attacheventlistener (Stopgoallink, "click", Stopgoal, false);
function Stopgoal ()
{
Clearinterval (intervalprocess);
}
As long as you click on the Stopgoallink, no matter when you click, Intervalprocess will be canceled, and will not continue to execute intervalprocess again and again. If the settimeout is canceled within the time-out period, the termination effect can also be implemented in SetTimeout, as follows:
File:settimeout_setinterval4.js (excerpt)
var timeoutprocess = setTimeout ("alert (' goal! ')", 3000);
var stopgoallink = document.getElementById ("Stopgoallink");
Attacheventlistener (Stopgoallink, "click", Stopgoal, false);
function Stopgoal ()
{
Cleartimeout (timeoutprocess);
}
Transferred from: http://www.cnblogs.com/sk-net/archive/2008/01/24/1050770.html
Differences in the use of setinterval and settimeout