Timer usage of SetInterval and setTimeout in javascript

Source: Internet
Author: User
The setTimeOut and setInterval functions of Javascript are widely used to process latency and scheduled tasks. For example, a logon box is displayed after a webpage is opened for a period of time, the page sends asynchronous requests to obtain the latest data at intervals. This article uses code examples to introduce the timer usage of SetInterval and setTimeout in javascript. setTimeout () the method is used to call a function or expression after a specified number of milliseconds, while setInterval () calls a function or expression cyclically every specified number of milliseconds until clearInterval clears it. That is to say, setTimeout () is executed only once, and setInterval () can be executed multiple times. The parameters of the two functions are the same. The first parameter is the code or handle to be executed, and the second parameter is the number of milliseconds of delay.

SetTimeOut usage

The setTimeout function is used as follows:

var timeoutID = window.setTimeout(func, [delay, param1, param2, ...]); var timeoutID = window.setTimeout(code, [delay]);

TimeoutID: the ID of the timer, which can be used to clear the timer in the clearTimeout () function.

Func: The executed function.

Code: (Alternative syntax) A code string to be executed.

Delay: the delay time, in milliseconds. If not specified, the default value is 0.

We can use window. setTimeout or setTimeout. The two statements are basically the same, except that window. setTimeout references the setTimeout function as an attribute of the global window object.

Application Example:

function timeout(){  document.getElementById('res').innerHTML=Math.floor(Math.random()*100 + 1); } setTimeout("timeout()",5000);

During code execution, the timeout () function is called five seconds later.

SetInterval usage

The parameters and usage of the setInterval function are the same as those of the setTimeout function. For more information, see the usage of the setTimeout function. The difference is that setInterval executes the func or code at a certain time.

Application Example:

var tt = 10; function timego(){  tt--;  document.getElementById("tt").innerHTML = tt;  if(tt==0){   window.location.href='/';   return false;  } } var timer = window.setInterval("timego()",1000);

The timego () function defines the page element # content displayed by tt. When tt is 0, the page is directed to the home page. Then we define a timer and call timego () every 1 second using setInterval (). In this way, timego executes 10 times, and each time the number tt is reduced by 1 until it is 0. To stop the timer, use the following code:

window.clearInterval(timer);

When the code is executed, the page jumps to the homepage 10 seconds later.

In fact, setTimeout () can also implement repeated execution of a function at intervals, but we still use setTimeOut and setInterval in a simple way. In addition, javascript runs in the browser's javascript engine in a single thread mode. In actual applications, complicated tasks need to be executed in a queue, which may lead to inaccurate timer time, this issue needs to be considered in large-scale applications. This article will not go into detail.

Example 2:

Set latency in JS:

SetInterval is similar to setTimeout. SetTimeout is used to perform an operation after a delay period.

SetTimeout ("function", time) sets a timeout object setInterval ("function", time) sets a timeout object

SetInterval indicates automatic repetition, and setTimeout does not.

ClearTimeout (object) clears the set setTimeout object clearInterval (object) clears the set setInterval object

Using a timer to implement JavaScript deferred execution or repeated execution of window objects provides two methods to implement the timer effect, namely window. setTimeout () and window. setInterval. The former allows a piece of code to run after a specified time, while the latter allows a piece of code to run once every time.

Their prototype is as follows: window. setTimeout (expression, milliseconds); window. setInterval (expression, milliseconds); expression can be a piece of code enclosed in quotation marks or a function name. at the specified time, the system automatically calls the function, when a function name is used as the call handle, it cannot contain any parameters. When a string is used, you can write the parameters to be passed.

The second parameter of the two methods is milliseconds, which indicates the number of milliseconds of delay or repeated execution.

The following describes two methods.

1. window. setTimeout method this method can delay the execution of a function, for example:

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.