从Javascript image（）元素构造函数获取图像属性

我正在使用

newimage（）

，像这样预加载图像：

function preload() {
  var imgs = [];
  for (i = 0; i < arguments.length; i++) {
    imgs[i] = new Image();
    imgs[i].src = arguments[i];
  }
return imgs;
}

//function being called like so
var paths = ["../images/image01.jpg","../images/image02.jpg", ...];
var images = preload.apply(null, paths);

函数预加载（）{
var-imgs=[]；
对于（i=0；i

这将返回

img对象的数组

。。。当使用

console.log（）显示时，所有属性都为空

我的问题是-如何获得每个预加载图像的宽度和高度

甚至更多——是否有可能以某种神秘的方式提前获得这些维度（某种预读预装的预装图像），这样我就可以创建特定大小的预装图像

很抱歉，如果我不明白“这些东西是如何工作的”这一点，我经常会遇到这种情况

仅作澄清

正如@Waterscroll所指出的，加载图像需要时间，因此必须在发生
.onload
事件时获取图像属性。稍后，图像可以通过一些
回调函数处理

请随意查看其他答案，因为它们显示了对该主题更实际的方法

如果我可以添加一些东西-在某些情况下，将图像尺寸存储在数据库中可能是有益的。在这个特定的脚本中，我从数据库中获取文件路径，因此我也可以使用图像大小来实现这一点。
这可能会对您有所帮助。如果不等待加载，则宽度或高度将不可用


var url='1〕http://placehold.it/';
变量路径=[“400x40”、“500x50”、“600x60”、“700x70”、“800x80”]；
var images=preload.apply（空，路径）//预加载图像
//监听每个元素上的onload，准备好后打印w/h
image.forEach（函数（条目）{
entry.onload=函数（）{
document.getElementById（'output'）.innerHTML+=this.width+'x'+this.height+'
'；
};
});
//预加载功能
函数预加载（）{
var-imgs=[]；
对于（i=0；i

设置
src
属性后，需要一段时间才能加载图像。在某些浏览器中，您可以使用load事件了解图像何时加载，在不支持该事件的浏览器中，您可以使用complete属性检查图像是否已加载。加载图像后，您应该能够通过naturalHeight和naturalWidth属性获取图像的高度和宽度

在不加载图像的情况下获取图像高度和宽度的唯一方法是将该信息保存在脚本或脚本内部可以到达的位置。
要回答您的问题如何确保所有图像都已加载？，您需要跟踪阵列中所有图像的加载情况。确保像我一样在
src
属性之前设置
onload
事件。我将集合传递给
AllImagesLoadedCallback（）
函数仅用于测试，这样我就可以打印尺寸，但您不需要传递任何内容或传递任何参数，也不需要在该函数中执行任何您喜欢的操作



函数预加载（）{
var-imgs=[]；
var count=arguments.length；
var=0；
对于（i=0；i”；
对于（var i=0；i”；
}
}
//这只是一个调用preload（）的测试。
var m=预载（“http://placehold.it/400x40","http://placehold.it/500x50","http://placehold.it/200x20");
//警报（m.length）；
arguments
首先声明在哪里？@PedroLobito
arguments
不需要声明。它只是“一个类似数组的对象，对应于传递给函数的参数。”-我没有看到传递给函数的任何参数。@PedroLobito，因为OP没有调用函数的代码。编辑了此函数的调用方式。很抱歉，起初错误地将jQuery代码用于侦听器，现在将其更正为javascript:）欢迎你现在就投票给我我想，情况就是这样。我一做完测试就接受你的回答。谢谢。这个话题的每个答案都有点好。对于
回调函数
，肯定+1。