setInterval()的使用

setInterval()的使用setInterval()作用这个函数可以将一个函数每隔一段时间执行一次参数1.回调函数,该函数会每隔一段时间被调用一次2.每次调用间隔的时间,单位是毫秒返回值返回一个Number类型的数据,这个数字用来作为定时器的唯一标识使用写法一:<!DOCTYPEhtml>

大家好,欢迎来到IT知识分享网。setInterval()的使用"

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

(0)

相关推荐

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注

关注微信