js中setTimeout与setInterval的区别

来源：互联网发布：百安居建材知乎编辑：程序博客网时间：2024/05/01 03:35

很多人都觉得这两个方法差不多,但是,实际上,他们差的很远呢
因为setTimeout(表达式,延时时间)在执行时,是在载入后延迟指定时间后,去执行一次表达式,记住,次数是一次
而setInterval(表达式,交互时间)则不一样,它从载入后,每隔指定的时间就执行一次表达式
所以,完全是不一样的。

setTimeout(Expression,DelayTime),在DelayTime过后,将执行一次Expression
setInterval(expression,delayTime),每个DelayTime,都将执行Expression

Html代码

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>
<body>
<div id="a"></div>
<div id="b"></div>
<script type="text/javascript">
setTimeout("document.getElementById('a').innerHTML=new Date().getSeconds();",1000);
setInterval("document.getElementById('b').innerHTML=new Date().getSeconds();",1000);
</script>
</body>
</html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title></head><body><div id="a"></div><div id="b"></div><script type="text/javascript">setTimeout("document.getElementById('a').innerHTML=new Date().getSeconds();",1000);setInterval("document.getElementById('b').innerHTML=new Date().getSeconds();",1000);</script></body></html>

运行会发现，a中的内容更新一次则不在变动，而b中的内容则随着时间的变化一直变化。
setInterval会不停的循环执行表达式。