vue 如何获取图片的原图尺寸_JS快速获取图片宽高的方法

快速获取图片的宽高其实是为了预先做好排版样式布局做准备，通过快速获取图片宽高的方法比onload方法要节省很多时间，甚至一分钟以上都有可能，并且这种方法适用主流浏览器包括IE低版本浏览器。

一、简陋的获取图片方式

// 图片地址 后面加时间戳是为了避免缓存

var img_url = 'http://www.qttc.net/static/upload/2013/13643608813441.jpg?'+Date.parse(new Date());

// 创建对象

var img = new Image();

// 改变图片的src

img.src = img_url;

// 打印

alert('width:'+img.width+',height:'+img.height);

结果如下：

宽高都是0的这个结果很正常，因为图片的相关数据都没有被加载前它的宽高默认就是0 于是可以这么优化！

二、onload后在打印

// 图片地址 后面加时间戳是为了避免缓存

var img_url = 'http://www.qttc.net/static/upload/2013/13643608813441.jpg?'+Date.parse(new Date());

// 创建对象

var img = new Image();

// 改变图片的src

img.src = img_url;

// 加载完成执行

img.onload