javascript - 如何在 Javascript 中每隔几秒调用一个函数？

Question

不知道为什么这在 Javascript 中很难做到...有点令人沮丧 LOL

这是我尝试过的一种方法:

function rotateDavid() {
  $("#david").css({
    'transform' : 'rotate(90deg)'
  });
  setTimeout(rotateDavid, 10000);
};
rotateDavid();

它会执行一次但不会重复...我不知道...

Answer 1

这里的问题不是你如何调用函数。在某些情况下，这种方式实际上优于 setInterval。

您遇到的问题是将 Css 设置为 90 度并不会一遍又一遍地更改它。您每次都将其设置为相同的度数。

您需要在每次迭代时更新 Angular 。因此，在这种情况下，您要向其添加 90。

var rotation = 0;
function rotateDavid() {
  rotation += 1
  $("#david").css({
    'transform' : 'rotate(' + (90 * rotation) + 'deg)'
  });
  setTimeout(rotateDavid, 1000);
};
rotateDavid();

div{
  width:100px;
  height: 100px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="david">Hi</div>

您还可以使用模运算符来防止数字变得过大。

'transform' : 'rotate(' + (90 * (rotation%4)) + 'deg)'