Js 获取图片原始宽高

在涉及到图片显示、处理的时候,前端常会需要获取图片真实宽高,如下即可。

function getImageSizeOf(src, thenFn){
  var _img = document.createElement('img'); 
  _img.addEventListener('load', function(){
    console.log(this.width, this.height)
    typeof thenFn === 'function' && thenFn(this.width, this.height)
  });
  _img.src = src;
}

当然,上述代码只是一个简单实现,说明具体思路而已,可能会有不兼容部分浏览器的问题,如果你使用 jQuery ,也可以直接使用下面这个基于 jQuery ,兼容性更好的版本:

function getImageSizeOf(src, thenFn){
  $("<img>").attr("src", src).load(function(){
    console.log(this.width, this.height)
    typeof thenFn === 'function' && thenFn(this.width, this.height)
  });
}