用js实现读写
使用 File System Access API 读写文件
现代浏览器支持 File System Access API,允许网页应用直接读写本地文件系统。
读取文件
async function readFile() {
const [fileHandle] = await window.showOpenFilePicker();
const file = await fileHandle.getFile();
const content = await file.text();
console.log(content);
}
写入文件
async function writeFile(content) {
const handle = await window.showSaveFilePicker();
const writable = await handle.createWritable();
await writable.write(content);
await writable.close();
}
使用 Node.js fs 模块
在 Node.js 环境中,可以使用内置的 fs 模块进行文件操作。
同步读写
const fs = require('fs');
// 同步读取
const data = fs.readFileSync('file.txt', 'utf8');
// 同步写入
fs.writeFileSync('file.txt', 'Hello World', 'utf8');
异步读写
const fs = require('fs/promises');
// 异步读取
async function readFile() {
try {
const data = await fs.readFile('file.txt', 'utf8');
console.log(data);
} catch (err) {
console.error(err);
}
}
// 异步写入
async function writeFile() {
try {
await fs.writeFile('file.txt', 'Hello World', 'utf8');
} catch (err) {
console.error(err);
}
}
使用浏览器 FileReader API
对于传统浏览器文件读取,可以使用 FileReader API。
读取文件内容
function handleFileSelect(event) {
const file = event.target.files[0];
const reader = new FileReader();
reader.onload = function(e) {
const content = e.target.result;
console.log(content);
};
reader.readAsText(file);
}
document.getElementById('fileInput').addEventListener('change', handleFileSelect);
使用 localStorage 进行简单数据存储
对于少量数据的持久化存储,可以使用 localStorage。
存储数据
localStorage.setItem('key', 'value');
读取数据
const value = localStorage.getItem('key');
删除数据
localStorage.removeItem('key');
使用 IndexedDB 进行复杂数据存储
对于更复杂的客户端存储需求,可以使用 IndexedDB。
打开数据库

const request = indexedDB.open('MyDatabase', 1);
request.onupgradeneeded = function(e) {
const db = e.target.result;
const store = db.createObjectStore('MyStore', { keyPath: 'id' });
};
request.onsuccess = function(e) {
const db = e.target.result;
// 数据库操作
};






