js 获取dom距离

dom.offsetTop ：

• 含义：获取子dom相对于父dom的距离（距离上方或上层控件的上边框的位置）
• 需求：获取dom距离页面顶部的距离（此距离并非是dom距离浏览器顶部的距离）
• 应用：因为页面布局就是盒子套盒子，所以可以直接使用递归把父盒子都遍历一遍（会有误差需要自己把获得的数据修饰一下），这个时候不管怎么滑动页面，获取的距离是不变的，然后通过相对父组件的位置进行定位。
• 我的当前需求为：点击某个按钮，展示一个盒子，盒子需要在按钮的下方。由于按钮的上层盒子使用了position:sticky，所以没法通过弹框相对按钮盒子进行定位，另外一些原因也没法用element-ui的propve来弹出。只有把弹框加在根元素下，通过点击事件获取dom 通过dom遍历 找到点击的dom距离页面顶端 也就是根dom的位置，然后动态给弹框添加样式 达到点击按钮 在按钮下方弹出弹窗的目的，当然这样做 会有几px的误差，但是没办法了。

 有一个更详细的链接：https://blog.csdn.net/zh_rey/article/details/78967174

 同步更新中...