网上查资料发现是各个浏览器下对是否有声明的scrollTop有差异
IE：
对于没有声明的页面，使用 document.body.scrollTop 或 document.documentElement.scrollTop；
对于有声明的页面，则使用 document.documentElement.scrollTop；
Chrome、Firefox：
对于没有声明的页面，使用 document.body.scrollTop 来获取 scrollTop ；
对于有声明的页面，则使用 document.documentElement.scrollTop；
Safari:
safari 比较特别，有自己获取scrollTop的函数 ： window.pageYOffset ；
可以使用下面代码在各个浏览器进行打印测试
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>scrollTop</title> <style> body{ margin: 0; padding: 0; height: 1000px; } </style> </head> <body> <div> test scrollTop </div> <script> window.onscroll = function () { var sTop = document.body.scrollTop; console.log(sTop); }; </script> </body> </html>已经定位问题，如何解决呢？
为了兼容所有浏览器，封装一个函数，去获取页面的scrollTop
export function getScrollTop() { return window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0; }