获取页面各个高度

文档底部与可视区窗口底部的距离 = 文档总高度 - 文档滚动高度 - 可视区窗口高度
当前元素与底部的距离 = 可视区窗口高度 + 文档滚动高度 - 当前元素与页面顶部距离 - 当前元素高度

高度

console.log(window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0) // 文档滚动高度
    
console.log($(document).height()) // 文档总高度
    
console.log(document.documentElement.clientHeight) // 可视区窗口高度
      
console.log($('xxx').height()) // 当前元素高度
     
console.log($('xxx').offset().top) // 当前元素与页面顶部距离

其他高度

网页可见区域宽：document.body.clientWidth
网页可见区域高：document.body.clientHeight
网页可见区域宽：document.body.offsetWidth (包括边线的宽)
网页可见区域高：document.body.offsetHeight (包括边线的宽)
网页正文全文宽：document.body.scrollWidth
网页正文全文高：document.body.scrollHeight
网页被卷去的高：document.body.scrollTop
网页被卷去的左：document.body.scrollLeft
网页正文部分上：window.screenTop
网页正文部分左：window.screenLeft
屏幕分辨率的高：window.screen.height
屏幕分辨率的宽：window.screen.width
屏幕可用工作区高度：window.screen.availHeight
屏幕可用工作区宽度：window.screen.availWidth