|
很多时候，我们需要实现页面内的跳转，除了使用锚点外，还可能会用doby.scrollTop = el.offsetTop. 但有时候，这种方式用起来却有些问题，滚动条滚动的位置往往并不是预想中的目标元素的位置，这是为什么呢？ 其实是offsetTop的问题，offsetTop的取值是有一个相对元素的，这个相对元素显然不一定是body，所以当使用doby.scrollTop = el.offsetTop时，自然不会跳到预想中的位置。那么，要怎么做呢？请看下面的函数：
// 元素相对于body的offsetTop
export function getOffsetTopByBody (el) {
let offsetTop = 0
while (el && el.tagName !== 'BODY') {
offsetTop += el.offsetTop
el = el.offsetParent
}
return offsetTop
}
其实每个元素都是有一个offsetParent的属性，这个属性就记录了该元素取offsetTop值的相对元素，然后再求相对元素的相对元素，如此层层相加知道body，即可获取到实际相对于body的offsetTop了offsetWidth一般使用比较少，但是原理也是这样。
| 
收藏
淘帖
踩
