跨域 XMLHttpRequest对象

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)	添加一个请求头 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();

第四步：根据请求返回的状态，实现不同的响应。