html距离左边与顶部,js获取DOM节点到浏览器顶部或左侧距离的方法

js获取DOM节点到浏览器顶部或左侧距离的方法

发布时间：2020-08-28 10:07:12

来源：亿速云

阅读：116

作者：小新

js获取DOM节点到浏览器顶部或左侧距离的方法？这个问题可能是我们日常学习或工作经常见到的。希望通过这个问题能让你收获颇深。下面是小编给大家带来的参考内容，让我们一起来看看吧！

关于js获取dom 节点到浏览器顶或左部的距离，Jquery里面有封装好的offset().top/offset().left，只到父级的顶/左部距离position().top/position().left。

原生写的话就是用获取节点，do while循环就可以了。代码如下

原生JS获取DOM 节点到顶部的距离

• 11111
• 11111
• 11111
• 11111
• 11111

var dom = document.getElementById('item');

var iTop = 0;

do {

iTop += dom.offsetTop;//如果是左侧就是offsetLeft

dom = dom.parentNode //如果DOM 节点 的parentNode存在，把当前的节点赋予成parentNode；

} while (dom.parentNode);

console.log(iTop)

感谢各位的阅读！看完上述内容，你们对js获取DOM节点到浏览器顶部或左侧距离的方法大概了解了吗？希望文章内容对大家有所帮助。如果想了解更多相关文章内容，欢迎关注亿速云行业资讯频道。