js如何获取图片的尺寸？

JavaScript09

js如何获取图片的尺寸？,第1张

项目的需求是上传一张图片，然后验证该图片的尺寸，如果跟预期的不符，就不给上传

首先，可以通过new FileReader()，再通过将上传的图片文件传给实例的readAsDataUrl()，当文件加载完成触发onload事件，传递event，通过event.target.result来获取图片的链接(base64格式的)

接着，new Image()实例，将上面获取的链接设置为图片的src属性，当图片加载完成触发onload事件就可以通过width、height属性来读取图片的长宽啦~~

方法一：获取图片的宽高。可以用offsetWidth和offsetHeight

方法二：

你先获取img标签标签元素。用getElementById()或者getElementsByClassName或者getElementsByTagName()都可以。

获取之后，如果你的img图片有width和height 属性，可以直接用img元素对象点属性

document.getElementsByTagName("img")[0].width

document.getElementsByTagName("img")[0].height

3.如果img元素本身没有width和height属性。你可以获取img元素的style样式

function getStyle(obj,attr){

return obj.currentStyle?obj.currentStyle[attr]:getComputedStyle(obj)[attr]

｝；

obj是你的img标签对象，attr是你的想要获取的属性；

currentStyle支持IE低版本浏览器，

getComputedStyle支持主流浏览器