使用JS操作文件可以通过浏览器的FileReader API或Node.js的fs模块来实现。下面分别介绍这两种方式的实现方法。
使用FileReader读取文件
步骤
- 通过
<input type="file">元素选择文件，获取文件的File对象 - 利用FileReader对象读取文件内容
- 将读取的文件内容显示到页面上
代码示例
<!DOCTYPE html>
<html>
<head>
<title>使用FileReader读取文件</title>
<meta charset="UTF-8">
</head>
<body>
<input type="file" id="fileInput">
<div id="fileContent"></div>
<script>
const fileInput = document.getElementById('fileInput')
const fileContent = document.getElementById('fileContent')
fileInput.addEventListener('change', (event) => {
const file = event.target.files[0]
const reader = new FileReader()
reader.onload = (event) => {
fileContent.textContent = event.target.result
}
reader.readAsText(file)
})
</script>
</body>
</html>
在上面的代码里，当用户选择文件后，change事件触发，我们通过FileReader对象读取文件内容，通过readAsText()方法将文件内容转换为字符串，并将其赋值给textContent属性，最后将读取到的文件内容显示在页面上。
使用Node的fs模块操作文件
步骤
- 引入
fs模块 - 选择文件，获取文件路径
- 读取文件内容
- 将读取到的内容进行处理
代码示例
const fs = require('fs')
fs.readFile('test.txt', 'utf-8', (err, data) => {
if (err) throw err
console.log(data)
})
在上面的代码里，我们通过require('fs')来引入fs模块。然后通过fs.readFile()方法来读取文件，参数分别为文件路径、编码方式和回调函数。回调函数中的err代表读取文件时的错误信息，data代表读取到的文件内容。
总之，无论是使用浏览器的FileReader API还是Node的fs模块，都可以通过简单的几行代码实现文件的读取。
本站文章如无特殊说明，均为本站原创，如若转载，请注明出处：使用JS操作文件(FileReader读取–node的fs) - Python技术站
微信扫一扫 
支付宝扫一扫 