通过使用jQuery中的animate 和scrollTop 方法，不用插件就可以创建一个滚动到顶部的简单动画
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>canvas-1</title> <script type="text/javascript" src="./public/2.1.js"></script> </head> <body> <h1>像马宫一样学习！</h1> <table border="1"> <tr> <td>1</td> <td>22</td> <td>33</td> <td>444</td> <td>5555</td> </tr> <tr> <td>1</td> <td>22</td> <td>33</td> <td>444</td> <td>5555</td> </tr> <tr> <td>1</td> <td>22</td> <td>33</td> <td>444</td> <td>5555</td> </tr> </table> <table border="1" style="margin-top:1000px;"> <tr> <td>1</td> <td>22</td> <td>33</td> <td>444</td> <td>5555</td> </tr> <tr> <td>1</td> <td>22</td> <td>33</td> <td>444</td> <td>5555</td> </tr> <tr> <td>1</td> <td>22</td> <td>33</td> <td>444</td> <td>5555</td> <td> <span class="top" style="cursor:pointer;">Back to top</span> </td> </tr> </table> </body> <script> $(function(){ // alert("aaaa"); $('.top').click(function (e) { e.preventDefault(); $('html, body').animate({scrollTop: 0}, 800); }); }); </script> </html>