The definition and usage of window.setInterval() method and the difference between offsetLeft and style.left

The definition and usage of window.setInterval() method and the difference between offsetLeft and style.left_javascript skills

WBOY

Release： 2016-05-16 15:32:40

Original

1314 people have browsed it

Definition and usage

The setInterval() method can call a function or calculate an expression according to the specified period (in milliseconds).

The

setInterval() method will continue to call the function until clearInterval() is called or the window is closed. The ID value returned by setInterval() can be used as an argument to the clearInterval() method.

Tip: 1000 milliseconds = 1 second.

Grammar

setInterval(code,millisec,lang)

参数	描述
code	必需。要调用的函数或要执行的代码串。
millisec	必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。
lang	可选。 JScript \| VBScript \| JavaScript

Summary:

This method can execute a program according to the specified cycle. The period is in milliseconds.

This method will execute forever if you do not close the browser or call the clearInterval() method .

The return value is the unique ID of this method.

To stop the execution of this timer function, please refer to the chapter clearInterval() method.

Click to see more properties and methods of the window object.

Browser support:

(1). IE browser supports this method.
(2). Firefox browser supports this method.
(3). Opera browser supports this method.
(4). Chrome browser supports this method.
(5).Safria browser supports this method.

Code example:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<script type="text/javascript"> 
window.onload=function(){ 
 n=0; 
 function show(){ 
 document.getElementById("mytext").value=n+1; 
 n=n+1; 
 } 
 var flag=setInterval(show,1000) 
} 
</script> 
</head> 
<body> 
<input type="text" size=10 id="mytext" /> 
</body> 
</html>

Copy after login

Let me introduce to you the difference between offsetLeft and style.left

offsetLeft gets the left margin relative to the parent object

left gets or sets the left margin

relative to the parent object with positioning attribute (position is defined as relative)

If the position of the parent div is defined as relative and the position of the child div is defined as absolute, then the value of style.left of the child div is relative to the value of the parent div,
This is the same as offsetLeft, the difference is:

1. style.left returns a string, such as 28px, and offsetLeft returns a value of 28. If you need to calculate the obtained value,
It is more convenient to use offsetLeft.

2. style.left is read-write, offsetLeft is read-only, so to change the position of the div, you can only modify style.left.

3. The value of style.left needs to be defined in advance, otherwise the value obtained will be empty. And it must be defined in html. I have done experiments. If it is defined in
In css, the value of style.left is still empty. This is the problem I encountered at the beginning. I can't always get the value of style.left.

offsetLeft can still be obtained without defining the position of the div in advance.