js快速获取图片宽高

js快速获取图片宽高

记录获取图片宽高的方式

  const loadImg = (url) => {
    return new Promise((resolve, reject) => {
      let imgDom = document.createElement("img");
      // let imgDom = new Image(); 也可使用Image对象创建；
      imgDom.src = url;
      if (imgDom.complete) {
        resolve({ picWidth: imgDom.width, picHeight: imgDom.height });
      } else {
        imgDom.onload = (imgData) => {
          resolve({ picWidth: imgDom.width, picHeight: imgDom.height });
        };
        imgDom.onerror = (err) => {
          // console.log("err", err);
          // reject(err); 如果使用reject返回，可以在使用时使用try catch
          resolve(null);
        };
      }
    });
  };

// 使用
const imgData = await loadImg(imgUrl);
if (imgData) {
   let { picWidth, picHeight } = imgData;
   console.log(`picWidth=${picWidth}, picHeight=${picHeight}`);
}

如果需要查看详细的img介绍可以查看HTMLImageElement的详细文档地址