JavaScript getBoundingClientRect（）vs offsetHeight，同时计算元素高度

Question

获得元素高度的最佳方法是什么：

var myElement = document.querySelector('.some-class');

var height = myElement.getBoundingClientRect().height;

要么

var myElement = document.querySelector('.some-class');

var height = myElement.offsetHeight;  

Answer 1

大多数情况下，当没有任何变换应用于元素时，这些与getBoundingClientRect（）的宽度和高度相同。 在转换的情况下，offsetWidth和offsetHeight返回元素的布局宽度和高度，而getBoundingClientRect（）返回渲染宽度和高度。 例如，如果元素的宽度为：100px; 和变换：规模（0.5）; getBoundingClientRect（）将返回50作为宽度，而offsetWidth将返回100。

https://developer.mozilla.org/en-US/docs/Web/API/CSS_Object_Model/Det​​ermining_the_dimensions_of_elements