创建发送异步通讯对象Ajax请求、数据回调及属性状态说明
简单了解了一下 Ajax 技术，及 Ajax 的应用，顺便做个笔记。
什么是 ajax ？
AJAX即“Asynchronous Javascript And XML”（异步JavaScript和XML），是指一种创建交互式网页应用的网页开发技术。
简单地说，AJAX是一种用异请求数据的技术，发送出请求以后，不需要刷新页面就可以更新当前浏览器内的数据或内容。
- 异步 JavaScript 和 XML
- 是指一种创建交互式网页应用的网页开发技术
- 异步请求数据的技术
HTML部分： #resText 接收返回的数据， #statusText 接收返回的状态
<button onclick="send()">发送Ajax</button>
<h3 id="resText"></h3>
<h3 id="statusText"></h3>创建异步通讯对象：
XMLHttpRequest 是 JavaScript 内部对象之一，该对象用于在后台与服务器交换数据，是实现 AJAX 技术的基础。
Chrome：new XMLHttpRequest();
IE5.5/IE6：new ActiveXObject("Microsoft.XMLHTTP");
兼容 Chrome 和 IE 浏览器可以这样写：
//1.创建异步通讯对象
var xmlHttpRequest = null;
if (window.XMLHttpRequest) {
xmlHttpRequest = new XMLHttpRequest();
} else if (window.ActiveXObject) {//ie5.5,6
xmlHttpRequest = new ActiveXObject("Microsoft.XMLHTTP");
} else {
alert("你的浏览器太Low了，不支持HttpRequest对象！")
}打开操作，发送请求：
如果对象不为 NULL ，发送请求 xmlHttpRequest.send() ，当发送 GET 请求时为 true ，因为直接在地址传值，当发送 POST 请求时，应该是需要传递的值。
if(xmlHttpRequest!=null){
//2.打开操作
//参数1：请求的方式 get，post
//参数2：请求的地址 index.php ajax.php
//参数3：是否异步请求 true：异步 false：同步
xmlHttpRequest.open("GET","get.php",true);
//3.设置回调监听函数
xmlHttpRequest.onreadystatechange = callback;
//4.发送请求
// 参数：当发送GET请求时：true
// 当发送POST请求时：需要传递的值
xmlHttpRequest.send(true);
}回调函数：
// 5.接收回调
console.log(xmlHttpRequest.responseText); //字符串类型需要介绍一下两个属性：
readyStatus ：
XMLHttpRequest 对象的状态：
0：未初始化。对象已创建，未调用 open ；
1：open 方法成功调用，但 Sendf 方法未调用；
2：send 方法已经调用，尚未开始接受数据；
3：正在接受数据。Http 响应头信息已经接受，但尚未接收完成；
4：完成，即响应数据接受完成。
我们在回调的时候，如果直接 console 接收的数据，打印出多条数据。
status ：
服务器返回的 http 状态码。
200 表示“成功”；
404 表示“未找到”；
500 表示“服务器内部错误”等。
所以要判断异步请求成功并且服务器返回状态正常，再进行数据打印。所以应该这样写 ?
优化后的函数回调：
//回调函数
function callback() {
if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200){ //readyState：4 回发数据接收成功
// 5.接收回调
console.log(xmlHttpRequest.responseText); //字符串类型
document.getElementById("resText").innerHTML = xmlHttpRequest.responseText;
document.getElementById("statusText").innerHTML = xmlHttpRequest.statusText;
}
}其他属性说明：
Onreadystatechange ：请求状态改变的事件触发器（readyState 变化时会调用这个属性上注册的 JavaScript 函数）。
responseText ：服务器响应的文本内容。
responseXML ：服务器响应的XML内容对应的DOM对象。
statusText ：服务器返回状态的文本信息。
声明：本文由w3h5原创，转载请注明出处：《创建发送异步通讯对象Ajax请求、数据回调及属性状态说明》 https://cloud.tencent.com/developer/article/1537784