naturalWidth 是元素的自然宽度,它永远不会改变。例如,即使使用 CSS 或 JavaScript 调整图像大小,100px 宽的图像的自然宽度始终为 100px。

widthwidth 属性的值。它可能会发生更改,并且可以通过 CSS 或 JavaScript 进行更新。

我们可以通过给定 url 加载的图像的获取自然宽度:

const getNaturalWidth = url => {
  return new Promise((resolve, reject) => {
    const img = new Image()
    img.addEventListener('load', () => {
      resolve(img.naturalWidth)
    })
    img.addEventListener('error', () => reject())
    img.src = url
  })
}

getNaturalWidth('https://path/to/image.png').then(naturalWidth => {
  // ...
})