为啥经常看到用setTimeout嵌套代替setInterva
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了为啥经常看到用setTimeout嵌套代替setInterva相关的知识，希望对你有一定的参考价值。
setTimeout应该是设置多长时间过时，如30秒还没响应就过时，无效了！ setInterval应该是设置时间间隔，如隔30秒就刷新一次屏幕等 参考技术A //setTimeout()在一秒后执行，但是只执行一次setTimeout(function()
//定时执行内容
，1000)
//setInterval()每隔一秒执行一次
setInterval(function()
//定时执行内容
，1000)本回答被提问者采纳 参考技术B 前者可以通过创建一个循环函数重复调用
js动画之requestAnimationFrame回调函数代替setTimeout
继续完善我上一篇博客：https://www.cnblogs.com/duanhuarong/p/12195466.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
* {margin: 0;padding: 0;}
#div1 {width: 200px;height: 200px;position: absolute;left: 0;background: red;}
</style>
</head>
<body>
<div id="div1"></div>
<script>
window.onload = function () {
let Odiv = document.getElementById("div1");
let disX = 5;
let disY = 5;
let x=0;
let y=0;
let maxWidth = window.innerWidth - Odiv.offsetWidth-disX; //浏览器左边界=浏览器宽度-div的宽度-水平速度矢量
let maxHeight = window.innerHeight - Odiv.offsetHeight-disY; //浏览器右边界=浏览器高度-div的高度-垂直速度矢量
function auto(){
if(x>=maxWidth)disX*=-1;
if(y>=maxHeight)disY*=-1;
if(x<0)disX*=-1;
if(y<0)disY*=-1;
x+=disX;
y+=disY;
Odiv.style.left=x+\'px\';
Odiv.style.top=y+\'px\';
//和setTimeout一样，要手动调用才能实现连续动画。
window.requestAnimationFrame(auto);
}
auto();
}
</script>
</body>
</html>
以上是关于为啥经常看到用setTimeout嵌套代替setInterva的主要内容，如果未能解决你的问题，请参考以下文章
页面实现一个简单的时钟，怎么用setTimeOut代替setInterval呢？