当前位置：文江博客话题详情

在附加到DOM之前，IMG的宽度？

发布于 2025-02-08 10:47:08 字数 107 浏览 1 评论 0原文

我已经完成了一些简单的代码任务，发现我可以通过其IMG和IMG的下载的高度和宽度，而无需将其附加到DOM，而无需将其附加到DOM。这是Crossbrowser吗？ Coud找不到有关此行为的任何信息。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

佞臣 2025-02-15 10:47:08

您可以使用NaturalWidth和NaturalHeight为此要求。它们分别代表图像的原始宽度和高度。

NaturalWidth - 标签中使用的图像的原始宽度。

width - 标签宽度属性的值/默认值。

NaturalHeight - 标签中使用的图像的原始高度。

高度 - 标签高度属性的值/默认值。

例如：

let src = 'http://www.fillmurray.com/g/400/600';
let img = document.createElement('img');
img.onload = () => {
  console.log(`naturalWidth = ${img.naturalWidth}`);
  console.log(`naturalHeight = ${img.naturalHeight }`);
}
img.src = src;

有关NaturalHeight - htttps：/htttps：/ /Developer.mozilla.org/en-us/docs/web/api/htmlemageelement/naturalheight

You can use the naturalWidth and naturalHeight for that requirement. They represent the original width and height respectively of the image.

naturalWidth - the original width of the image used in tag.

width - the value/default value of width attribute of tag.

naturalHeight - the original height of the image used in tag.

height - the value/default value of height attribute of tag.

For example:

let src = 'http://www.fillmurray.com/g/400/600';
let img = document.createElement('img');
img.onload = () => {
  console.log(`naturalWidth = ${img.naturalWidth}`);
  console.log(`naturalHeight = ${img.naturalHeight }`);
}
img.src = src;

More about naturalHeight - https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/naturalHeight

More about naturalWidth - https://developer.mozilla.org/en-US/docs/Web/API/HTMLImageElement/naturalWidth

回复收藏 0 原文

~没有更多了~