如何在纯javascript中添加平滑滚动动画？

function smoothScrollTo(targetPosition, duration) {
  const startPosition = window.scrollY;
  const distance = targetPosition - startPosition;
  const startTime = performance.now();

  function scrollAnimation(currentTime) {
    const elapsedTime = currentTime - startTime;
    const scrollProgress = Math.min(elapsedTime / duration, 1);
    const scrollDistance = distance * scrollProgress;
    window.scrollTo(0, startPosition + scrollDistance);

    if (scrollProgress < 1) {
      requestAnimationFrame(scrollAnimation);
    }
  }

  requestAnimationFrame(scrollAnimation);
}

// 使用示例
const scrollToElement = document.getElementById('targetElement');
const targetPosition = scrollToElement.getBoundingClientRect().top + window.scrollY;
const duration = 1000; // 持续时间为1秒

smoothScrollTo(targetPosition, duration);