html,js上传图片前预览图片

URL.createObjectURL() 静态方法会创建一个 DOMString，其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象。

用这个web接口可以预览上传的图片：

<input type="file" id="btn" accept="image/*" value="点击上传" />
<img id="img"/>

$("#btn").addEventListener('change',function(){
	let file = this.files[0];
	// 进一步防止文件类型错误
	if(!/image\/\w+/.test(file.type)){  
        alert("请选择图片！");  
        return false;  
    }  
	document.getElementById("img").src = URL.createObjectURL(file)
})