众所周知JavaScript在设计上处于安全角度考虑，是不允许读写本地文件的（原因请自行百度）；

但是在实际项目应用中，经常会使用到上传图片，并且可以让用户直接预览图片。对于此种做法有两种方法可以实现：一是前后台交互，后台将图片地址返回前端；

二是，我今天写的内容，使用FileReader对象——允许Web应用程序异步读取存储在用户计算机上的文件（或原始数据缓冲区）的内容；此种方法可以优化图片加载速度，减少方法一占用带宽的问题；

但是，此种方法兼容性存在问题，主要是IE浏览器（ie10以上没问题），本文不在讨论兼容性问题，代码如下：

直接复用测试即可，FileReader对象是通过将图片url转换成base64格式，然后显示出来。