AJAX理论知识

一、介绍
AJAX是基于现有的Internet标准
AJAX是基于现有的Internet标准，并且联合使用它们：
XMLHttpRequest 对象 (异步的与服务器交换数据)
JavaScript/DOM (信息显示/交互)
CSS (给数据定义样式)
XML (作为转换数据的格式)
二、Ajax的组成元素
1.XMLHttpRequest 
是 AJAX 的基础,XMLHttpRequest 对象用于和服务器交换数据
创建：var xhr = new XMLHttpRequest();
2.如需将请求发送到服务器，我们使用 XMLHttpRequest 对象的 open() 和 send() 方法：
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();
注意：
GET 还是 POST？
与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。
然而，在以下情况中，请使用 POST 请求：
无法使用缓存文件（更新服务器上的文件或数据库）
向服务器发送大量数据（POST 没有数据量限制）
发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠
xmlhttp.open("GET","demo_get.html?t=" + Math.random(),true);//避免取得的结果是缓存，给url加上唯一的id
xmlhttp.send();

注意：
在xmlHttp.send方法中，如果带了参数则为post,否则为get方式
注意：
异步 - True 或 False？
AJAX 指的是异步 JavaScript 和 XML（Asynchronous JavaScript and XML）。
XMLHttpRequest 对象如果要用于 AJAX 的话，其 open() 方法的 async 参数必须设置为 true：
xmlhttp.open("GET","ajax_test.html",true);
【四要素】
var xhr = new XMLHttpRequest();
xmlhttp.onreadystatechange=function()
 {
 if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
}
 }
xmlhttp.open("GET","ajax_info.txt",true);
xmlhttp.send();
【onreadystatechange事件】
readyState：
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪
status:
200: "OK"
404: 未找到页面

注意： onreadystatechange 事件被触发 5 次（0 - 4），对应着 readyState 的每个变化。

function ajaxFun(){
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
if(xhr.readyState==4&&xhr.status=200){
document.getElementById().innerHTML = xhr.responseText;
}
}
xhr.open("GET","ajax_info.jsp",true);
xhr.send();
}