【每日一练】四行代码实现图片预览

图片上传预览:图片的上传在很多的项目中都会用到，上传图片时如果能够及时的预览到上传图片，对于提高用户体验是相当的有帮助，本博客就以此为基础，撰写上传图片使得预览功能。

文件预览有四个固定步骤：（核心代码如下）

(1)给file表单注册onchange注册事件：用户选择文件 heroIcon：预览位置

document.querySelector('#heroIcon').onchange = function () {

(2)获取用户选择的文件

let file = this.files[0]

(3)将file对象转为url路径

let url = URL.createObjectURL(file)

(4)将url路径设置给img标签的src

document.querySelector('.preview').src = url
}