图片标签的四种路径

img src的四种类型：

1. 网络地址：https://www.baidu.com/img/flexible/logo/pc/result@2.png
2. 相对地址：../../imgs/test.png
3. base64地址： data:application/octet-stream;base64,
4. blod地址：blob:https://mdn.github.io/3eac363f-add5-4d82-9e73-db5880437a67
   
   

文件转成blob: window.URL.createObjectURL

var file = document.querySelector('input[type=file]').files[0];
img.src = window.URL.createObjectURL(file);

文件/blob转成base64: new FileReader() 读取指定的 Blob 或 File 对象

var file = document.querySelector('input[type=file]').files[0];
var reader = new FileReader();

reader.addEventListener("load", function () {
　　img.src = reader.result;
}, false);

if (file) {

　　// 文件转成base64
　　reader.readAsDataURL(file);

　　// blob转成base64
　　// var blob = window.URL.createObjectURL(file);
　　// reader.readAsDataURL(blob);
}