滚动到 div jQuery - JavaScript

当我们需要将网页滚动到某个特定的 div 时，可以使用 jQuery 或 JavaScript 来实现。

使用 jQuery 实现

我们可以使用 jQuery 提供的 animate() 方法来实现滚动到指定 div，具体方法如下：

$('html, body').animate({
    scrollTop: $('#目标 div 的 ID 或 class').offset().top
}, 'slow');

其中，scrollTop 固定设置为 $('#目标 div 的 ID 或 class').offset().top，'slow' 则是设置动画过渡的时间，单位是毫秒。

代码示例：

$("#scroll-btn").click(function() {
  $('html, body').animate({
      scrollTop: $('#scroll-top').offset().top
  }, 'slow');
});

使用 JavaScript 实现

如果你不想依赖 jQuery，也可以使用纯 JavaScript 来实现滚动到指定 div，具体方法如下：

document.querySelector('#目标 div 的 ID 或 class').scrollIntoView({
  behavior: 'smooth'
});

其中，behavior 的值可以设置为 'smooth' 或 'auto'，前者表示平滑滚动，后者表示瞬间滚动。

代码示例：

var scrollBtn = document.querySelector("#scroll-btn");
var scrollToTop = document.querySelector("#scroll-top");

scrollBtn.addEventListener("click", function () {
  //scroll to top
  scrollToTop.scrollIntoView({ behavior: "smooth" });
});

以上就是实现滚动到指定 div 的两种方式，根据需要选择适合自己的方法即可。