XMLHttpRequest对象是ajax编程的基础，用于发送请求（数据）与服务端进行交互。
目前主流浏览器都内置了XMLHttpRequest对象。
浏览器会使用XMLHttpRequest对象来创建Ajax请求。
XMLHttpRequest对象的方法
| 方法 | 说明 |
|---|---|
| open(method, url, async) | 指定请求类型 method: 请求类型: GET 或 POST url: 服务器URL async: true (asynchronous)异步 或 false (synchronous) 同步 |
| send() | 发送请求到服务端 |
| send(string) | 发送请求到服务端 |
| setRequestHeader(header, value) |
添加一个请求头 |
采用GET还是POST
methond请求有GET和POST，应该选择哪种呢？
GET比 POST 更简单、更快, 并且可以在大多数情况下使用。
但是, 在下列情况下始终使用 POST 请求:
- 更新服务器上的数据。
- 向服务器发送大量数据 (POST 没有大小限制)。
- 发送用户输入 (可以包含未知字符), POST 比获取更健壮、更安全。
采用异步还是同步
通过异步发送, JavaScript 不必等待服务器响应, 而是可以:
- 在等待服务器响应时执行其他脚本
- 响应就绪后处理响应
|
1
|
xhttp.open("GET", "ajax_test.jsp", true);
|
open () 方法的异步参数设置为 true表示采用异步:
示例
|
1
2
3
4
5
6
7
8
9
10
11
12
13
|
<script>
function loadDoc() {
var xhttp = new XMLHttpRequest();
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();
}
</script>
|
第一步：创建一个XMLHttpRequest对象实例
第二步：xhttp.open("GET", "ajax_info.txt", true); 准备处理GET请求，请求地址是ajax_info.txt
第三步：发送请求，xhttp.send();
第四步：根据请求返回的状态，实现不同的响应。
