Question

是否可以从Javascript中找到HTML文档中图像的内在大小？

Answer 1

在脚本中创建一个Image元素，并将src属性设置为与您要测量的图像相同的URL。然后，您可以阅读width和height属性。

为了获得可靠的结果，您需要确保加载图像，如完整示例所示：

<!DOCTYPE html>
<style>
    img { width: 100% }
</style>
<img id="my_image_element" src="rustacean.jpeg">
<script>
    var url = my_image_element.src;
    var img = new Image;
    img.onload = function() {
        console.log("Intrinsic size: "+ img.width +"x"+ img.height);
    };
    img.src = url;
</script>

credit

Answer 2

一个非常古老的问题，但这是我搜索时的结尾。这些天（自IE9开始）具有naturalHeight和naturalWidth属性：

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

我认为这些给了我我想要的东西。

用于查找HTML图像内在大小的脚本

2 个答案: