Question

我用以下两种方法之一计算元素el的y位置：

var elTop = 0;                    
do{
    el += el.offsetTop;
    }while(el = el.offsetParent); 
    window.scrollTo(0, elTop);

和

   var elTop = (el.getBoundingClientRect()).top;
   window.scrollTo(0, elTop);

在两种情况下，elTop太高而且scrollTo跳得太远。

我在线尝试了这个脚本。当我用Firefox下载整个页面时，它突然起作用了。视觉外观或结构在线/离线没有差异。只有body的offsetHeight和搜索到的元素的offsetTop。

这些属性如何在没有任何视觉效果的情况下发生变化？

Answer 1

为避免上述问题，您应该考虑使用getBoundingClientRect（）+“page scroll”而不是计算所有元素偏移。

var yPosition = element.getBoundingClientRect().top + window.pageYOffset;

请注意，此解决方案不适用于＆lt; IE9。