使用javascript读写本地文件的方法

File API是html5新标准，既可以读文件，也可以写文件，注意这里的

读文件：OS中文件系统中的文件读到浏览器页面中

写文件：将浏览器页面数据写到浏览器文件系统中

参见博客：http://www.html5rocks.com/en/tutorials/file/dndfiles/

其中讲解很详细，不过读文件时用的是读图片。这里贴一份读文本的代码

<script type=“text/javascript” src=“ReadTest.js”>
var a=new Array();
function handleFileSelect(evt) {
var files = evt.target.files; // FileList object
if(files[0])
{
var reader = new FileReader();
reader.readAsText(files[0]);
reader.onload = loaded;
}
}
function loaded(evt) {
var fileString = evt.target.result;
alert(fileString);
}
</script>
</head>
<body>
<input type=“file” id=“file” name=“files[]” multiple />
<script type=“text/javascript”>
var btn=document.getElementById(‘file’);
btn.addEventListener(‘change’, handleFileSelect, false);
</script>
</body>
</html>

读文件用到FileReader接口，写文件使用FileWriter，写文件是要将页面数据写入到浏览器的文件系统(root) 中，而我需要的是保存到 OS的文件系统中，所以采用另一种方法：先用BlobBuilder把要写入的数据合成Blob，创建表示Blob的URL，再根据不同浏览器选择保存策略，实际就是下载文件

JS文件:

function doSave(value, type, name) {  
    var blob;  
    if (typeof window.Blob == “function”) {  
        blob = new Blob([value], {type: type});  
    } else {  
        var BlobBuilder = window.BlobBuilder || window.MozBlobBuilder || window.WebKitBlobBuilder || window.MSBlobBuilder;  
        var bb = new BlobBuilder();  
        bb.append(value);  
        blob = bb.getBlob(type);  
    }  
    var URL = window.URL || window.webkitURL;  
    var bloburl = URL.createObjectURL(blob);  
    var anchor = document.createElement(“a”);  
    if (‘download’ in anchor) {  
        anchor.style.visibility = “hidden”;  
        anchor.href = bloburl;  
        anchor.download = name;  
        document.body.appendChild(anchor);  
        var evt = document.createEvent(“MouseEvents”);  
        evt.initEvent(“click”, true, true);  
        anchor.dispatchEvent(evt);  
        document.body.removeChild(anchor);  
    } else if (navigator.msSaveBlob) {  
        navigator.msSaveBlob(blob, name);  
    } else {  
        location.href = bloburl;  
    }  
}  
  
var a=new Array();  
for(var i=0;i<10;i++)  
a.push(i);  
  
function Save(){  
    doSave(a, “text/latex”, “hello.txt”);   
}  

HTML文件:

<!DOCTYPE html>  
<html>  
<head>  
    <script type=‘text/javascript’ src=“SaveBlob.js”/>   
</head>  
<body>  
    <input type=“button” id=“savetext” value=“Save” onclick=“Save()”/></div>  
</body>  
</html>  