XMLHttpRequest 对象用于同服务器交换数据。
如需向服务器发送请求,我们使用 XMLHttpRequest 对象的 open() 和 send() 方法:
xhttp.open("GET", "ajax_info.txt", true); xhttp.send();
方法 | 描述 |
---|---|
open(method, url, async) |
规定请求的类型
|
send() | 向服务器发送请求(用于 GET) |
send(string) | 向服务器发送请求(用于 POST) |
GET 比 POST 更简单更快,可用于大多数情况下。
不过,请在以下情况始终使用 POST:
一条简单的 GET 请求:
xhttp.open("GET", "demo_get.asp", true); xhttp.send();
在上面的例子中,您可能会获得一个缓存的结果。为了避免此情况,请向 URL 添加一个唯一的 ID:
xhttp.open("GET", "demo_get.asp?t=" + Math.random(), true); xhttp.send();
如果您需要用 GET 方法来发送信息,请向 URL 添加这些信息:
xhttp.open("GET", "demo_get2.asp?fname=Bill&lname=Gates", true); xhttp.send();
一条简单的 POST 请求:
xhttp.open("POST", "demo_post.asp", true); xhttp.send();
如需像 HTML 表单那样 POST 数据,请通过 setRequestHeader() 添加一个 HTTP 头部。请在 send() 方法中规定您需要发送的数据:
xhttp.open("POST", "ajax_test.asp", true); xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); xhttp.send("fname=Bill&lname=Gates");
方法 | 描述 |
---|---|
setRequestHeader(header, value) |
向请求添加 HTTP 头部
|
open() 方法的 url 参数,是服务器上文件的地址:
xhttp.open("GET", "ajax_test.asp", true);
该文件可以是任何类型的文件,如 .txt 和 .xml,或服务器脚本文件,如 .asp 和 .php(它们可以在发送回响应之前在服务器执行操作)。
如需异步发送请求,open() 方法的 async 参数必须设置为 true:
xhttp.open("GET", "ajax_test.asp", true);
发送异步请求对 web 开发人员来说是一个巨大的进步。服务器上执行的许多任务都非常耗时。在 AJAX 之前,此操作可能会导致应用程序挂起或停止。
通过异步发送,JavaScript 不必等待服务器响应,而是可以:
通过 XMLHttpRequest 对象,您可以定义当请求接收到应答时所执行的函数。
这个函数是在 XMLHttpResponse 对象的 onreadystatechange 属性中定义的:
xhttp.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) { document.getElementById("demo").innerHTML = this.responseText; } }; xhttp.open("GET", "ajax_info.txt", true); xhttp.send();
您将在稍后的章节学到更多有关 onreadystatechange 的知识。
如需执行同步的请求,请把 open() 方法中的第三个参数设置为 false:
xhttp.open("GET", "ajax_info.txt", false);
有时 async = false 用于快速测试。你也会在更老的 JavaScript 代码中看到同步请求。
由于代码将等待服务器完成,所以不需要 onreadystatechange 函数:
xhttp.open("GET", "ajax_info.txt", false); xhttp.send(); document.getElementById("demo").innerHTML = xhttp.responseText;
我们不推荐同步的 XMLHttpRequest (async = false),因为 JavaScript 将停止执行直到服务器响应就绪。如果服务器繁忙或缓慢,应用程序将挂起或停止。
同步 XMLHttpRequest 正在从 Web 标准中移除,但是这个过程可能需要很多年。
现代开发工具被鼓励对使用同步请求做出警告,并且当这种情况发生时,可能会抛出 InvalidAccessError 异常。