Image 您是否必须将图像插入DOM以获取其尺寸?

Image 您是否必须将图像插入DOM以获取其尺寸?,image,dom,browser,cross-browser,Image,Dom,Browser,Cross Browser,您是否必须将图像插入DOM以获取其尺寸 还有许多人说是的,将img添加到dom屏幕外以获取其尺寸(加载后) ,其他人说不,您可以创建一个未添加到dom的img元素。然后将加载其图像并调整其大小 哪种观点适用于“现代”浏览器?是否有任何测试涵盖此问题。这种行为是为浏览器设计的吗 补充:我正在寻找证实这种行为的来源/参考。我已经有了很多代码示例。无需将元素添加到DOM中即可从中获取这些属性-只需创建元素,即可在JS中访问维度。尝试以下操作:- <!DOCTYPE html> <h

您是否必须将图像插入DOM以获取其尺寸

还有许多人说是的,将img添加到dom屏幕外以获取其尺寸(加载后)

,其他人说不,您可以创建一个未添加到dom的img元素。然后将加载其图像并调整其大小

哪种观点适用于“现代”浏览器?是否有任何测试涵盖此问题。这种行为是为浏览器设计的吗


补充:我正在寻找证实这种行为的来源/参考。我已经有了很多代码示例。

无需将元素添加到DOM中即可从中获取这些属性-只需创建
元素,即可在JS中访问维度。

尝试以下操作:-

<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title>answer</title>
    </head>
    <body>
        <script>
            var img = new Image;
            img.onload = function(){alert(img.width);};
            img.src = "image.png";
        </script>
    </body>
</html>

回答
var img=新图像;
img.onload=function(){alert(img.width);};
img.src=“image.png”;

这将
alert
图像宽度(假设与包含此htlm的文件位于同一文件夹中的图像名为
image.png

不,您可以创建img元素,它将具有其尺寸我的回答中的代码显示您可以创建图像并检索其宽度(或任何其他属性)而不将其添加到DOM中。你想要多清晰?好的,你怎么知道的?您在哪些浏览器中测试过这种行为?这种行为是故意的还是怪癖的。看起来隐藏的IMG也被加载了。有一天在某些浏览器中会改变吗?好的,你怎么知道的?您在哪些浏览器中测试过这种行为?这种行为是故意的还是怪癖的。看起来隐藏的IMG也被加载了。有一天在某些浏览器中会改变吗?我知道这一点,因为我已经在IE11、Chrome31.0.1650.57m和Firefox25.0.1中进行了测试。我认为这不是一个怪癖,因为从统计上看,所有三种浏览器的开发团队都不可能在其代码库中包含相同的怪癖。您的问题是,“是否必须将图像插入DOM以获取其尺寸?”而不是询问是否加载了隐藏的IMG。它会改变吗?可能这是一个无限的宇宙,还有很多时间要走。谢谢你的测试。我给了你支票。