添加参数 ajax 请求 - Javascript

在开发中，我们经常需要通过 ajax 请求来获取或者提交数据。在一些场景下，我们还需要通过添加额外的参数来满足业务需求。本文将介绍如何通过 Javascript 的 ajax 请求添加额外的参数。

ajax 请求的基本结构

在开始介绍如何添加额外参数之前，我们不得不先介绍一下 ajax 请求的基本结构。在 Javascript 中，我们可以通过以下代码来发起一个基本的 ajax 请求：

var xhr = new XMLHttpRequest(); // 创建xhr对象
xhr.open(method, url, async); // 设置请求方法，请求地址以及是否异步请求  
xhr.send(); // 发送ajax请求

在以上代码中，我们分别执行了以下操作：

1. 创建 XMLHttpRequest 对象。
2. 使用 open 方法设置请求方法，请求地址以及是否异步请求。
3. 使用 send 方法发送 ajax 请求。

添加额外参数

通过上述代码，我们可以发起一个基本的 ajax 请求。如果我们要在请求中添加额外参数，我们可以在 send 方法中设置参数。例如：

xhr.send("username=admin&password=123456");

在以上代码中，我们通过 send 方法添加了两个额外参数：username 和 password。

我们也可以将参数使用对象的方式传递，例如：

var params = {
  username: "admin",
  password: "123456"
};
xhr.send(JSON.stringify(params));

在以上代码中，我们将参数使用对象的方式传递，并将其转换成字符串格式传递。

POST 请求添加额外参数

对于 POST 请求，我们可以通过设置请求头以及 send 中的参数来添加额外参数。例如：

var xhr = new XMLHttpRequest();
xhr.open("POST", url, true); // 设置请求方式为 POST
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); // 设置请求头
var params = {
  username: "admin",
  password: "123456"
};
xhr.send(JSON.stringify(params));

在以上代码中，我们设置了 POST 请求的请求头，并将参数转换成字符串格式传递。

总结

本文介绍了如何通过 Javascript 的 ajax 请求来添加额外参数。我们可以在 send 方法中添加参数，也可以通过 POST 请求的方式添加参数。熟练掌握以上方法可以在开发中更好的满足业务需求。