1、html
<div ref="getheight"></div> <br><br>
2、JavaScript
// 获取高度值 （内容高+padding+边框） let height= this.$refs.getheight.offsetHeight;
// 获取元素样式值 （存在单位） let height = window.getComputedStyle(this.$refs.getheight).height; //获取元素内联样式值（非内联样式无法获取） let width= this.$refs.getheight.offsetWidht;
3,javascript中获取dom元素高度和宽度
javascript中获取dom元素高度和宽度的方法如下： 网页可见区域宽： document.body.clientWidth 网页可见区域高： document.body.clientHeight 网页可见区域宽： document.body.offsetWidth (包括边线的宽) 网页可见区域高： document.body.offsetHeight (包括边线的高) 网页正文全文宽： document.body.scrollWidth 网页正文全文高： document.body.scrollHeight 网页被卷去的高： document.body.scrollTop 网页被卷去的左： document.body.scrollLeft 对应的dom元素的宽高有以下几个常用的： 元素的实际高度：document.getElementById("div").offsetHeight 元素的实际宽度：document.getElementById("div").offsetWidth 元素的实际距离左边界的距离：document.getElementById("div").offsetLeft 元素的实际距离上边界的距离：document.getElementById("div").offsetTop
原文：https://www.cnblogs.com/zhangyezi/p/13232304.html