使用JS的 FileReader 读取本地文本文件（可兼容各种浏览器）

最近需要在客户端操作文件，看到网上有 FileReader 对象，链接：https://developer.mozilla.org/zh-CN/docs/Web/API/FileReader

还是直接上代码吧，大家自己看：

＜!DOCTYPE html＞
＜html＞
＜head＞
    ＜meta charset="UTF-8"＞
    ＜title＞Document＜/title＞
    ＜script type="text/javascript"＞
        function upload(input) {  
            //支持chrome IE10  
            if (window.FileReader) {  
                var file = input.files[0];  
                filename = file.name.split(".")[0];  
                var reader = new FileReader();  
                reader.onload = function() {  
                    console.log(this.result);  
                }  
                reader.readAsText(file);  
            }   
            //支持IE 7 8 9 10  
            else if (typeof window.ActiveXObject != 'undefined'){  
                var xmlDoc;   
                xmlDoc = new ActiveXObject("Microsoft.XMLDOM");   
                xmlDoc.async = false;   
                xmlDoc.load(input.value);   
                console.log(xmlDoc.xml);   
            }   
            //支持FF  
            else if (document.implementation && document.implementation.createDocument) {   
                var xmlDoc;   
                xmlDoc = document.implementation.createDocument("", "", null);   
                xmlDoc.async = false;   
                xmlDoc.load(input.value);   
                console.log(xmlDoc.xml);  
            } else {   
                alert('error');   
            }   
        }  
    ＜/script＞
＜/head＞
＜body＞
＜input type="file" onchange="upload(this)" /＞  
＜/body＞
＜/html＞

不仅可以读取文本文件，还可以读取JS文件，CSS，HTML等纯文本格式，下面是运行效果（读取了oracle的tnsnames.ora文件）

属性

FileReader.error 只读

一个DOMException，表示在读取文件时发生的错误。

FileReader.readyState 只读

表示FileReader状态的数字。取值如下：

常量名	值	描述
`EMPTY`	`0`	还没有加载任何数据。
`LOADING`	`1`	数据正在被加载。
`DONE`	`2`	已完成全部的读取请求。

FileReader.result 只读

文件的内容。该属性仅在读取操作完成后才有效，数据的格式取决于使用哪个方法来启动读取操作。

方法

FileReader.abort(): 中止读取操作。在返回时，readyState属性为DONE。
FileReader.readAsArrayBuffer(): 开始读取指定的 Blob中的内容，一旦完成，result 属性中保存的将是被读取文件的 ArrayBuffer 数据对象。
FileReader.readAsBinaryString() 非标准: 开始读取指定的Blob中的内容。一旦完成，result属性中将包含所读取文件的原始二进制数据。
FileReader.readAsDataURL(): 开始读取指定的Blob中的内容。一旦完成，result属性中将包含一个data: URL 格式的 Base64 字符串以表示所读取文件的内容。
FileReader.readAsText(): 开始读取指定的Blob中的内容。一旦完成，result属性中将包含一个字符串以表示所读取的文件内容。