js文件上传的几种方式？（js上传文件）
在 JavaScript 中，可以使用不同的方法来实现文件上传。以下是几种常见的 JavaScript 文件上传方式：
使用<input>元素和表单：
创建一个包含<input type=”file”>的表单元素，允许用户选择文件。
使用 JavaScript 通过监听表单提交事件来获取用户选择的文件。
可以使用 AJAX 或表单提交来将文件上传到服务器。
html
<form id=”fileUploadForm” action=”upload.php” method=”post” enctype=”multipart/form-data”>
<input type=”file” id=”fileInput” name=”file”>
<input type=”submit” value=”Upload File”>
</form>
<script>
document.getElementById(‘fileUploadForm’).addEventListener(‘submit’, function (e) {
e.preventDefault();
const fileInput = document.getElementById(‘fileInput’);
const file = fileInput.files[0];
// Use AJAX or form submission to upload the file.
});
</script>
使用第三方库：
使用第三方 JavaScript 文件上传库，如 Dropzone.js、Fine Uploader、或 Uppy。
这些库提供了丰富的功能，例如拖放支持、进度条、图像预览等。
使用Fetch API：
使用 Fetch API 进行文件上传。
创建一个 FormData 对象，将文件添加到其中，然后使用 Fetch 发送 POST 请求。
javascript
const fileInput = document.getElementById(‘fileInput’);
const file = fileInput.files[0];
const formData = new FormData();
formData.append(‘file’, file);
fetch(‘upload.php’, {
method: ‘POST’,
body: formData
}).then(response => {
// Handle the response
});
使用XMLHttpRequest：
使用 XMLHttpRequest 进行文件上传。
创建一个 FormData 对象，将文件添加到其中，然后发送 POST 请求。
javascript
const fileInput = document.getElementById(‘fileInput’);
const file = fileInput.files[0];
const formData = new FormData();
formData.append(‘file’, file);
const xhr = new XMLHttpRequest();
xhr.open(‘POST’, ‘upload.php’, true);
xhr.send(formData);
xhr.onreadystatechange = function () {
if (xhr.readyState === 4 && xhr.status === 200) {
// Handle the response
}
};
注意，无论使用哪种方法，都需要在服务器端处理文件上传，因为浏览器不允许 JavaScript 直接访问文件系统。服务器端可以使用不同的编程语言（如 PHP、Node.js、Python 等）来处理上传的文件。