场景：
用户提交数据时上传图片，预览在网页上（还未传至服务器）
原理：
用上传文件的File对象创建一个url路径，赋值给img的src属性
注意：
- 这个url路径在窗口关掉后失效
- 这是一个试验中的功能，IE10以下不支持，具体详见MDN文档
步骤1：
在HTML中，在input前面或后面写一个src为空的<img>用来放预览图
<input type=”file”>
<img src=”” alt=””>
步骤2：
在JS中，创建事件源为input[type=’file’]的onchange事件
说明：
一旦选择（变更）了本地上传的图片文件，则触发此事件，让浏览器将本地图片读取到页面上，实现图片预览。
document.querySelect(‘’input[type=file]”).onchange=function(){
}
步骤3：
写事件，为对象创建路径并赋值
说明：
- 这个函数（window的方法）创建出路径，浏览器能通过原生接口访问本地文件的路径，其中window可以省略，参数为需要创建路径的dom元素。
objectURL=window.URL.creatObjectURL(file或blob) -
input[type=’file’]选择文件后会返回一个File对象，为this.files[0]； - 将这个对象作为参数传入创建路径的函数中；
- 路径创建为
imgUrl = URL.ObjectURL(this.files[0])； - 赋值给图片的src
document.querySelector('input[type=file]').onchange=function(){
var imgUrl = URL.createObjectURL(this.files[0]);
document.querySelector('img').src = imgUrl ;
}
注意：
传入的参数应为dom元素。所以在jQuery中书写时，也用this即可，不要用$(this)。
this是DOM，$(this)是jQuery对象。
2018.1.4
