最近使用js写手机端页面时,有个地方需要获取一个元素的高度,发现手机旋转后获取的值不准确。经过查阅资料发现:
大多数情况下,当没有对元素应用任何转换时,这些值与 getBoundingClientRect()
的宽度和高度相同。在转换的情况下,offsetWidth
和 offsetHeight
返回元素的布局宽度和高度,而getBoundingClientRect()
返回渲染宽度和高度。例如,如果元素 width: 100px;transform: scale(0.5);
getBoundingClientRect() 将返回50作为宽度,而offsetWidth 将返回 100。