總結一下jquery獲取元素位置方法：
一般情況，最簡單的就是到達某一個元素時，元素出現(xiàn)：
$(window).scrollTop+$(window)[0].innerHeight
關于窗口大小（即就是可視區(qū)域大小）
其中jquery的 $(window).innerHeight()==$(window)[0].innerHeight 其實相當于jquer把這個原生js中的屬性封裝成了一個函數(shù) window.innnerHeight也和上面兩個式子相等.
還有一個：document.documentElement.clientHeight=window.innnerHeight
so 四個都相等啦！
關于滾動條：
$(window).scrollTop()=window.scrollY=document.body.scrollTop
頁面總高度
document.body.clientHeight
某個元素距離頂端的距離
document.getElementById("product-active").offsetTop(整數(shù))
只能說這兩個近似相等
$("#product-active").offset().top(浮點數(shù))
鼠標的相對距離
不存在e.target.offsetX這個屬性，只有e.target.offsetLeft這個屬性
注意如果事件綁定在<div><h1></h1></div>上，鼠標移入h1會觸發(fā)
此時得到的坐標應該為 e.target.offsetLeft+e.offsetX就是相當于相對div的距離。
另外clientX得到的是相對于可視窗口00點的坐標，而pageX相對于html的00坐標
注意理解！
// 變量的解構 其實就相當于給x賦值，因為e里面有e.offsetX這個屬性
let { offsetX: x, offsetY: y } = e;
getBoundingClientRect
getBoundingClientRect() 會得到四個值，分別是width,height,top,left。
注意得到的相對于視窗的top和left 如果相對于html記得加上滾動條的距離（window.scrollY或者document.body.scrollTop）
