FileReader方法：
- readerText():读取文本文件，可以使用TXT打开的文本文件，返回的是字符串形式，默认的编码格式是utf-8.
- readAsBinaryString()：读取任意类型的文件，返回的是二进制数据，后台接受后可以存储到数据库
- readAsDataURL():读取文件获取一段以data开头的字符串。DataURL是将资源转换为base64编码的字符串，文本一般是图像文本。
- abort()：中端读取。
FileReader提供的一些完整的事件：
- onbort:读取文件中断片时触发。
- onerror:读取文件错误时候时触发。
- onload:文件读取成功后触发的事件。
- onloadend:读取完成时触发，无论成功还是失败。
- onloadstart:开始读取时候触发。
- onprogress:读取文件过程中触发事件。
实例代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<!--实现图片的实时预览 onchange改变元素后触发方法-->
<from>
文件: <input type="file" name="myFile" id="myFile" multiple onchange="getFileContext()"><br>
<img id="img"><br>
<input type="submit">
</from>
<script>
function getFileContext() {
var reader=new FileReader();
//需要的参数是图片
var file=document.querySelector("#myFile").files;
// 没有返回值，将其结果储存在result中，无法判断文件是否读完
reader.readAsDataURL(file[0]);
reader.onload=function () {
// 展示出来：得到的reader.result为二进制文件base64 data:image/jpeg;base64...
console.log(reader.result);
document.querySelector("#img").src=reader.result;
}
}
</script>
</body>
</html>
这里是巧妙利用onchange触发改变事件，当前元素有改变时候触发。
reader.readAsDataURL(file[0]);是将得到的值转为dom操作对象。