前端-Ajax，服务器发送请求、服务器的相应和onreadystatechange事件

拿出来大家共勉，不足之处请指正。
很久之前的学习笔记了，一直存放在本地中

定义

AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。

AJAX 不是新的编程语言，而是一种使用现有标准的新方法。

AJAX 最大的优点是在不重新加载整个页面的情况下，可以与服务器交换数据并更新部分网页内容。

AJAX 不需要任何浏览器插件，但需要用户允许JavaScript在浏览器上执行

var a;
function loadXMLDoc(url,cfunc){
 if(window.XMLHttpRequest){
	    {
         	a=new XMLHttpRequest();
			}
			xmlhttp.onreadystatechange=cfunc;
			xmlhttp.open("GET",url,true)
			xmlhttp.send();
	}

function myfunction(){
		loadXMLDoc("文件路径"，function(){
		if(xmlhttp.readyState==4&&xmlhttp.status==200){
		document.getElementById("myDiv").innerHTML=a.responseText
			}
});	
}

XMLHttpRequest 对象

现代浏览器（大多数）均内建XMLHttpRequest 对象。

如果支持，则创建 XMLHttpRequest 对象。如果不支持，则创建 ActiveXObject ：

var a;
if (window.XMLHttpRequest)
{
	a=new XMLHttpRequest();
}

工作原理

向服务器发送请求/请求

open()/send()

利用XMLHttpRequest对象的此方法

var a = new XMLHttpRequest;
a.open("GET","ajax.txt",true);
a.open("method","url",true/false);
a.send();

get/post

get更快更简单但是post有更多优点

• 无法使用缓存文件
• 向服务器发送大量数据（POST无数据量限制）
• 发送包含未知字符的用户输入，post更稳定

需要像提交表单那样POST数据，需要用setRequestHeader添加HTTP头

a.open("GET","ajax.txt",true);
a.setRequestHeader("","")
a.send();

Async

true：异步 要规定在响应处于onreadystatechange的函数

false：同步 不要编写onreadystatechange函数

url

服务器上文件的地址，可以是任何类型的文件

服务器响应

response Text

来自服务器的响应并非XML，用此属性。

responseText属性返回字符串形式的响应

document.getElementById("myDiv").innerHTML=a.responseText

response XML

来自服务器的响应为XML，用此属性。

onreadystatechange事件

readystate存有XMLHttpRequest 对象状态信息，readystate每次改变，就会差法onreadystatechange事件

readystate

存有XMLHttpRequest 对象状态信息，0到4变化

1. 请求未初始化
2. 服务器连接已经建立
3. 请求已接收
4. 请求处理中
5. 请求已完成，且响应已就绪

status

200:‘OK’

404:未找到页面

readystate 为4且status为200，表示相应就绪