setInterval:
按照指定的周期(以毫秒计)来调用函数或计算表达式。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数 。
clearInterval:
取消由 setInterval() 设置的 interval。
setTimeout:
在指定的毫秒数后调用函数或计算表达式。由 setTimeout() 返回的 ID 值可用作 clearTimeout() 方法的参数。
clearTimeout:
取消由 setTime() 设置的 timeout。
setInterval与setTimeout的区别:
setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭;setTimeout() 只执行 code 一次,如果要多次调用,请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
例子:
1.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
function jump(){
location.href="http://www.baidu.com";
}
function t(){
console.log(111);
}
function c(){
clearInterval(id);
}
function s(){
id = setInterval("t()",1000);
}
</script>
<input type="button" value="按钮" onclick="jump()" />
<input type="button" value="开始" onclick="s()" />
<input type="button" value="结束" onclick="c()" />
</body>
</html>
当按下开始键,t方法会以1000毫秒为周期不断执行,直到按下结束键。
2.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<script>
function jump(){
location.href="http://www.baidu.com";
}
function t(){
console.log(111);
}
function c(){
clearTimeout(id);
}
function s(){
id = setTimeout("t()",1000);
}
</script>
<input type="button" value="按钮" onclick="jump()" />
<input type="button" value="开始" onclick="s()" />
<input type="button" value="结束" onclick="c()" />
</body>
</html>
当按下开始键,1000毫秒后执行t方法,之后不再执行,要阻止执行时可提前按下结束键方可阻止。