JavaScript 使用 Image 对象获取图片原始尺寸

JavaScript 获取图片原始尺寸方法

本文介绍一种利用 JavaScript 获取页面图片原始尺寸的方法，供读者参考。

该方法的核心在于使用 Image() 对象来获取图片的真实宽高。

这种方式操作简便，只需新建一个 Image() 对象，并将目标图片的 src 属性赋值给它，即可直接获取尺寸信息。

var img = new Image();
img.src = $("#target").attr("src");
if(img.complete){
  alert('width:'+img.width+',height'+img.height);
  img = null;
}else{
  img.onload = function(){
    alert('width:'+img.width+',height'+img.height);
    img = null;
  };
}

无需担心创建 Image 对象会触发额外的 HTTP 请求，因为浏览器在加载图片后已将其缓存。即使创建多个 Image 对象也是可行的，但需注意内存消耗，因此在获取尺寸后应将 img 变量置为 null。

更多关于 JavaScript 相关内容感兴趣的读者可查看本站专题：《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》

希望本文所述对大家 JavaScript 程序设计有所帮助。