JavaScript 保存文件到本地文件 JavaScript是一種廣泛應用于網頁開發的編程語言，它有著豐富的工具庫來實現各種功能。在許多場景下，需要將網站上的數據保存到本地硬盤，比如音樂播放器中的正在播放列表、視頻網站中的觀看記錄、在線文檔的自動保存等。本文將介紹如何使用JavaScript保存文件到本地文件，并提供具體的代碼示例。 準備工作 使用JavaScript保存文件到本地文件需要使用HTML5新增的File API，這個API在現代的瀏覽器中已經被廣泛支持。首先需要創建一個input標簽，用于選擇要保存的文件，具體實現如下：

<input type="file" name="saveFile" onchange="save(this)">

該標簽會調用名為“save”的JavaScript函數，該函數將會讀取選擇的文件并保存到本地文件中。 接下來需要編寫save函數，該函數有一個參數，表示選擇的文件。我們先來看如何讀取文件。 讀取文件 使用File API的第一步是獲取文件對象，可以通過input標簽中的files數組或者通過FileReader API來獲取文件對象。這里我們使用后者來獲取文件對象，并且使用了一個callback函數來處理讀取的數據。具體實現如下：

function read(file, callback) {
var reader = new FileReader();
reader.onload = function(event) {
callback(event.target.result);
};
reader.readAsText(file);
}

該函數接受兩個參數，第一個參數是File對象，表示要讀取的文件，第二個參數是一個回調函數，被用來處理讀取的數據。在此例中，我們使用了FileReader API中的“readAsText”方法來讀取文件并將文件內容作為字符串傳遞給回調函數。 保存文件 讀取完成后，我們可以使用HTML5新增的FileSaver API來將文件保存到本地文件系統中。該API提供了一個簡單的接口來向瀏覽器用戶顯示保存文件對話框。具體實現如下：

function save(input) {
var file = input.files[0];
read(file, function(contents) {
var blob = new Blob([contents], {type: "text/plain;charset=utf-8"});
saveAs(blob, file.name);
});
}

該函數接受一個參數，表示選擇的input標簽，它會獲取該標簽選擇的文件對象，并將其傳遞給前面提到的read函數。當讀取完成后，我們將讀取到的內容使用Blob對象進行封裝，并使用FileSaver API提供的“saveAs”函數顯示保存文件對話框。 以上代碼可以實現將文本文件保存到本地文件系統中。需要注意的是，該API還可以保存其他類型的文件，需要在Blob構造函數和FileSaver的saveAs方法中指定合適的MIME類型和文件名即可。 總結 JavaScript通過HTML5新增的File API和FileSaver API可以實現將網站上的數據保存到本地文件系統中。這樣可以方便用戶將感興趣的數據保存到本地進行隨時查看和編輯。具體實現需要在選擇文件、讀取內容和保存文件三個階段依次執行對應的函數，并且需要注意指定正確的MIME類型和文件名。