HTMLImageElement: naturalHeight プロパティ

<div class="box">
  <img
    src="/en-US/docs/Web/HTML/Element/img/clock-demo-400px.png"
    class="image"
    alt="A round wall clock with a white dial and black numbers" />
</div>
<pre></pre>

.box {
  width: 200px;
  height: 200px;
}
.image {
  width: 100%;
}

const output = document.querySelector("pre");
const image = document.querySelector("img");
image.addEventListener("load", (event) => {
  const { naturalWidth, naturalHeight, width, height } = image;
  output.textContent = `
自然なサイズ: ${naturalWidth} x ${naturalHeight} ピクセル
表示サイズ: ${width} x ${height} ピクセル
`;
});