滚动值的兼容问题

Posted 2020-07-27 Liesbeth

  最近做了一个滚动定位的特效，里面用到了scrollTop值，主要有以下两种解决浏览器兼容的问题

var top=document.documentElement.scrollTop || document.body.scrollTop;

var top = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop;

在网上查资料，很多前辈说如果有<!DOCTYPE...>声明document.body.scrollTop始终是0，而document.documentElement.scrollTop能得到正确值，相反，如果不做声明的话，document.documentElement.scrollTop反而会显示为0。但是在chrome浏览器中不管有没有声明document.documentElement.scrollTop始终为0.以document.body.scrollTop为准。发现此问题的过程是因为我用第二个语句判断的时候写错为判断

var top = document.documentElement ? document.documentElement.scrollTop : document.body.scrollTop;一直取得都是document.documentElement.scrollTop所以在chrome里面无效。
在此做一个记录。