1.前言想直接看干货的直接跳到第二点。有时候我们想在提交表单之前获取中选中的图片的一些信息，比如图片的宽高等，但是我们知道，只有一些基本信息可以通过文件控件的onchange事件获取文件，比如文件大小，最后修改时间等。嗯，首先想想前提，如何获取一张图片的宽高？！哦，只要先获取到目标图片元素，怎么获取图片元素？！第一种方法可以通过DOM操作获取目标（这里不做解释），然后通过对应的宽高属性获取宽高。第二种是在js中手动创建一个Image对象（下面是具体的代码示例），然后将相应的src赋值给Image对象。哇，哈哈，基本组织已经梳理完毕，请看下面实际代码操作：2.操作方法①window.URL||window.webkitURLBasicsupport:Chrome:8.0[2]Firefox(Gecko):4.0(2.0)[1]19.0(19.0)ie:10.0Opera:15.0[2]Safari:6.0[2]7.0注意：这只是一个实验性的技术还不稳定，语法可能会随着浏览器的更新而改变。window.URL属性返回一个对象，它提供了一个静态的createObjectURL()方法来创建和管理对象的URL。//基于jquery，选择一个本地文件$('#file').on('change',function(){leturl=window.URL||window.webkitURL;console.log(url.createObjectURL(this.files[0]));//this.files[0]为选中的文件（索引为0，因为它是单选），这里是图片letimg=newImage();//手动创建一个Image对象img.src=url.createObjectURL(this.files[0]);//创建Image对象的url图像。onload=function(){console.log('height:'+this.height+'----width:'+this.width)}});结果（google浏览器测试）：②由于HTML5中的FileReader是HTML5中的方法，当然有些低版本的ie不能用，欢迎具体反馈，嘻嘻$('#file').on('change',function(){letreader=newFileReader();reader.readAsDataURL(this.files[0]);//这里用base64编码一个文件，具体什么是base64编码，我会介绍reader.onload=function(e){letimg=newImage();img.src=e.target.result;//得到编码后的值，也可以用this.result得到img.onload=function(){console.log('height:'+this.height+'----width:'+this.width)}}结果（google浏览器测试）：3.结论这两种方式不兼容低版本浏览器，但考虑到会逐渐退出来自于市场，所以大胆先用吧，遇到问题再商量，说再见。
