AJAX(Asynchronous JavaScript and XML)主要用于在不重新加载整个页面的情况下与服务器交换数据。要发送文件内容,可以使用JavaScript中的`XMLHttpRequest`对象或者更现代的`fetch` API。
以下是如何使用这两种方法发送文件内容的基本步骤:
使用 `XMLHttpRequest` 发送文件内容
1. 创建一个`XMLHttpRequest`对象。
2. 使用`open`方法初始化这个请求。
3. 使用`send`方法发送请求,并传递文件对象。
```javascript
// 创建 XMLHttpRequest 对象
var xhr = new XMLHttpRequest();
// 初始化一个GET请求
xhr.open('POST', 'upload.php', true);
// 设置请求头,指定文件类型
xhr.setRequestHeader('Content-Type', 'multipart/form-data');
// 选择文件
var fileInput = document.getElementById('fileInput');
var file = fileInput.files[0];
// 发送文件
xhr.send(file);
```
使用 `fetch` API 发送文件内容
`fetch` API 提供了一种更现代、更简洁的方法来发送请求。它返回一个Promise对象,使得异步操作更加容易处理。
```javascript
// 获取文件
var fileInput = document.getElementById('fileInput');
var file = fileInput.files[0];
// 使用 fetch 发送文件
fetch('upload.php', {
method: 'POST',
body: new FormData(document.getElementById('fileForm'))