大家好,欢迎来到IT知识分享网。
setInterval()
作用
这个函数可以将一个函数每隔一段时间执行一次
参数
1.回调函数,该函数会每隔一段时间被调用一次
2.每次调用间隔的时间,单位是毫秒
返回值
返回一个Number类型的数据,这个数字用来作为定时器的唯一标识
使用
写法一:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload = function(){
//获取count
var count = document.getElementById("count");
var num = 1;
var timer = setInterval(function(){
count.innerHTML = num++;
if(num == 11){
//关闭定时器
clearInterval(timer);
}
},1000);
//clearInterval()可以用来关闭一个定时器
//方法中需要一个定时器的标识作为参数,这样将关闭标识对应的定时器
//clearInterval(timer);
};
</script>
</head>
<body>
<h1 id="count"></h1>
</body>
</html>
写法二:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload = function() {
var c = document.getElementById("count");
var num = 1;
var fun = function() {
c.innerHTML = num++;
if (num == 11) {
//关闭定时器
clearInterval(timer);
}
}
var timer = setInterval(fun, 1000);//这种方式fun一定不能写成fun()
};
</script>
</head>
<body>
<h1 id="count"></h1>
</body>
</html>
写法三:
每隔一段时间调用一次某对象中的某方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var count = null;//由于count声明为window全局变量,所以下面两种调用方式都可以
//如果不声明为全局变量,则只能使用 setInterval(count.fun, 1000); 的调用方式
window.onload = function() {
c = document.getElementById("count");
var num = 1;
var timer = null;
function Count() {
this.fun = function() {
c.innerHTML = num++;
if (num == 11) {
//关闭定时器
clearInterval(timer);
}
}
}
count = new Count();//为count赋值
timer = setInterval('count.fun()', 1000);//调用Count对象的fun()方法,这里的fun后面必须跟()
//timer = setInterval(count.fun, 1000);//调用Count对象的fun()方法,这里的fun后面不能加 ()
};
</script>
</head>
<body>
<h1 id="count"></h1>
</body>
</html>
写法四:
调用某全局方法
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
var count = null;
var num = 1;
var timer = null;
var c=null;//这里必须把c声明为全局属性,
var fun = function() {
c.innerHTML = num++;
if (num == 11) {
//关闭定时器
clearInterval(timer);
}
}
window.onload = function() {
c = document.getElementById("count");
timer = setInterval('fun()', 1000);
//timer = setInterval(fun, 1000);
};
</script>
</head>
<body>
<h1 id="count"></h1>
</body>
</html>
写法五
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script type="text/javascript">
window.onload = function() {
var c = document.getElementById("count");
var num = 1;
var fun = function() {
c.innerHTML = num++;
if (num == 11) {
//关闭定时器
clearInterval(timer);
}
}
var timer = setInterval(function(){
fun();
}, 1000);
};
</script>
</head>
<body>
<h1 id="count"></h1>
</body>
</html>
总结
1.setInterval()该方法能每隔一段时间调用某个方法
2.如果传入setInterval()方法中的是函数对象是局部函数,调用方式为:setInterval(fun,time); fun后面不能接括号
3.如果传入setInterval()方法中的是函数对象是全局函数,调用方式有两种:
一:setInterval(fun,time); fun后面不能接括号
二:setInterval(‘fun()’,time); fun后面必须带括号
免责声明:本站所有文章内容,图片,视频等均是来源于用户投稿和互联网及文摘转载整编而成,不代表本站观点,不承担相关法律责任。其著作权各归其原作者或其出版社所有。如发现本站有涉嫌抄袭侵权/违法违规的内容,侵犯到您的权益,请在线联系站长,一经查实,本站将立刻删除。 本文来自网络,若有侵权,请联系删除,如若转载,请注明出处:https://yundeesoft.com/31498.html