jquery 代码返回顶部

jQuery是一种流行的Javascript库，它被广泛用于网站开发中。在当今这个页面滚动的时代，许多网站都包括返回顶部的功能。如果您想添加这一功能，使用jQuery可以轻松地实现。以下是如何使用jQuery代码返回顶部的方法：

$(document).ready(function(){
  // 当点击返回顶部按钮时
  $('a.back-to-top').click(function(){
    // 滚动到顶部的速度
    $('html, body').animate({scrollTop: 0}, 800);
    return false;
  });
});

让我们来看看上面的代码：

• document.ready()函数意味着代码将在文档载入完毕时执行，保证代码能够运行。
• 'a.back-to-top'选择器指定了要添加点击事件的按钮。请注意，我们需要在HTML中定义这个按钮：<a href="#top" class="back-to-top">返回顶部</a>
• 当点击按钮时，事件处理程序将执行。使用.animate()函数实现平滑滚动到顶部，可自定义滚动速度。
• 最后，我们需要在事件处理程序中为函数返回false，以防止按钮刷新页面。

最后，在HTML中添加一个按钮，便能实现返回顶部的功能。以下是一个完整的例子：

<!-- HTML -->
<div class="container">
  <p>这是一个很长的页面，需要滚动。</p>
  <a href="#top" class="back-to-top">返回顶部</a>
</div>

<!-- jQuery -->
<script>
  $(document).ready(function(){
    $('a.back-to-top').click(function(){
      $('html, body').animate({scrollTop: 0}, 800);
      return false;
    });
  });
</script>

现在，在您的网站上添加返回顶部的功能已经很容易了！