SOURCE

console 命令行工具 X clear

                    
>
console
<!DOCTYPE html>
<html>
<head>
  <title>requestAnimationFrame 示例</title>
</head>
<body>
  <div id="box" style="width: 100px; height: 100px; background-color: red;"></div>

  <script>
    const box = document.getElementById('box');
    let positionX = 0;

    // 定义动画函数
    function animate() {
      // 更新盒子的位置
      box.style.transform = `translateX(${positionX}px)`;

      // 更新下一帧的位置
      positionX += 1;

      // 通过 requestAnimationFrame 递归调用动画函数
      requestAnimationFrame(animate);
    }

    // 启动动画
    requestAnimationFrame(animate);
  </script>
</body>
</html>