for循环创建Image()，但获取宽度和高度失败

for循环创建Image()，但获取宽度和高度失败是因为在循环中创建的Image对象还没有加载完成，所以无法立即获取到宽度和高度信息。这是因为Image对象的加载是异步的过程，需要等待图片加载完成后才能获取到宽度和高度。

解决这个问题的方法是使用回调函数或Promise来确保在获取宽度和高度之前等待图片加载完成。以下是一个示例代码：

function loadImage(url) {
  return new Promise((resolve, reject) => {
    const img = new Image();
    img.onload = function() {
      resolve(img);
    };
    img.onerror = function() {
      reject(new Error('Failed to load image'));
    };
    img.src = url;
  });
}

async function getImageSize(url) {
  try {
    const img = await loadImage(url);
    const width = img.width;
    const height = img.height;
    console.log('Width:', width);
    console.log('Height:', height);
  } catch (error) {
    console.error(error);
  }
}

// 使用示例
for (let i = 0; i < 10; i++) {
  const imageUrl = `https://example.com/image${i}.jpg`;
  getImageSize(imageUrl);
}

在上述代码中，loadImage函数返回一个Promise对象，当图片加载成功时，Promise会被resolve，并将加载完成的Image对象作为参数传递给resolve函数。如果加载失败，则Promise会被reject，并传递一个错误对象。

getImageSize函数使用async/await语法来等待图片加载完成，并获取宽度和高度信息。在循环中调用getImageSize函数来获取每个图片的宽度和高度。

这样，通过使用Promise和async/await，我们可以确保在获取宽度和高度之前等待图片加载完成，从而解决获取宽度和高度失败的问题。

腾讯云相关产品和产品介绍链接地址：