Javascript 获取图像的宽度和高度

因此，我有一个元素，我想获得图像的高度和宽度属性，但这是我的css：

设h=Number（window.getComputedStyle（document.getElementById（'image'））.getPropertyValue（'height'）。replace（'px'，''）；
设w=Number（window.getComputedStyle（document.getElementById（'image'））.getPropertyValue（'width'）.replace（'px'，''）；
console.log（`width`，w）；
console.log（`height`，h）
img#图像{
z指数：0；
显示：块；
顶部：0px；
左边距：自动；
右边距：自动；
最大高度：100%；
最大宽度：100%；
位置：绝对位置；
自对准：居中；
保证金：自动；
左：0；
右：0；
}
棘手的世界
问题是需要先加载图像

这是一个非常有趣的问题

在这里，在下面的代码中，我们正在检查是否加载了图像，如果是这样，我们直接获得宽度和高度，没有任何问题

但是如果图像还没有加载，我们会设置一个事件侦听器来跟踪它。加载后，将调用事件侦听器中的函数，仅此而已。现在您可以访问有关图像的所有信息


const img=document.getElementById（“img”）；
如果（图像完成）{
控制台日志（img.宽度，img.高度）；
}否则{
img.addEventListener（'load'，function（）{
const imageWidthRendered=this.width；
const imageHeightRendered=this.height；
日志（imageWidthRendered、imageHeightRendered）
});
}
是否要使图像高度和宽度响应？因此，它可以自动在屏幕上进行调整。getComputedStyle有一个像您现在这样的问题。它返回布局前的值（现在称为已用值），而不是布局后的值。请参阅本文件注释部分的第3段。你为什么不尝试其他方法来衡量这些价值呢？