如何获取img元素的动态高度？答案

【问题标题】：How to get the dynamic height of an img element?如何获取img元素的动态高度？
【发布时间】：2020-09-09 06:34:36
【问题描述】：

我正在更改 img 的 src 并且我加载的图像并不总是具有相同的高度。我想获取图像的高度，以便使用 jQuery 正确调整大小和位置。

如果img 元素的高度设置为自动并且其父高度也设置为自动，我如何获取它的高度？

尝试.parentNode 对我不起作用。 .outerHeight() 和 .height() 返回 0。还有哪些其他解决方案？

【问题讨论】：

【解决方案1】：

图片是异步加载的。不能马上查看它的高度，否则返回的高度总是0。需要等到图片加载完毕再查询它的高度。一个例子：

let img = document.querySelector("img");
img.addEventListener("load", function() {
	console.log(this.offsetHeight);
});

&lt;img src="https://source.unsplash.com/random"&gt;

【讨论】：