一、ajax实例及详解
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script> function loadXMLDoc() { var xmlhttp; if (window.XMLHttpRequest) //返回当前浏览器XMLHttpRequest请求（值：true | false） { // IE7+, Firefox, Chrome, Opera, Safari 浏览器执行代码 xmlhttp=new XMLHttpRequest(); //实例化一个XMLHttpRequest对象 } else { // IE6, IE5 浏览器执行代码 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); //实例化一个XMLHttpRequest对象 } xmlhttp.onreadystatechange=function() //每当 readyState 属性改变时，就会调用该函数。 { if (xmlhttp.readyState==4 && xmlhttp.status==200) // readyState，释义：返回XMLHTTP请求的当前状态；status,释义：返回XMLHTTP与后台交互时的一个状态码。
{
//获取div并将获取的字符按HTML标记语言格式取出；responseText：获得字符串形式的响应数据。若为：responseXML：获得 XML 形式的响应数据
document.getElementById("myDiv").innerHTML=xmlhttp.responseText; } } xmlhttp.open("GET","/try/ajax/ajax_info.txt",true); // open(method,url,async) ： 规定请求的类型、URL 以及是否异步处理请求。 xmlhttp.send(); //send(string ) 将请求发送到服务器。 } </script> </head> <body> <div id="myDiv"><h2>使用 AJAX 修改该文本内容</h2></div> <button type="button" οnclick="loadXMLDoc()">修改内容</button> </body> </html>
二、相关变量及参数说明
1. 创建 XMLHttpRequest 对象
所有现代浏览器（IE7+、Firefox、Chrome、Safari 以及 Opera）均内建 XMLHttpRequest 对象。
创建 XMLHttpRequest 对象的语法：
variable=new XMLHttpRequest();
老版本的 Internet Explorer （IE5 和 IE6）使用 ActiveX 对象：
variable=new ActiveXObject("Microsoft.XMLHTTP");
为了应对所有的现代浏览器，包括 IE5 和 IE6，请检查浏览器是否支持 XMLHttpRequest 对象。如果支持，则创建 XMLHttpRequest 对象。如果不支持，则创建 ActiveXObject ：
2. onreadystatechange 事件
当请求被发送到服务器时，我们需要执行一些基于响应的任务。
每当 readyState 改变时，就会触发 onreadystatechange 事件。
readyState 属性存有 XMLHttpRequest 的状态信息。
下面是 XMLHttpRequest 对象的三个重要的属性：
（1）、onreadystatechange事件：存储函数，每当readyState改变时会调用这个函数。
（2）、readyState释义：返回XMLHTTP请求的当前状态。
变量，此属性只读，状态用长度为4的整型表示.定义如下：
0 （未初始化） 对象已建立，但是尚未初始化（尚未调用open方法） 1 （初始化） 已调用send()方法，正在发送请求 2 （发送数据） send方法调用完成，但是当前的状态及http头未知 3 （数据传送中） 已接收部分数据，因为响应及http头不全，这时通过responseXML和responseText获取部分数据会出现错误， 4 （完成） 数据接收完毕，此时可以通过通过responseXML和responseText获取完整的回应数据
（3）、常用状态码（status）及其含义：
200：服务器响应正常。 304：该资源在上次请求之后没有任何修改（这通常用于浏览器的缓存机制，使用GET请求时尤其需要注意）。 400：无法找到请求的资源。 401：访问资源的权限不够。 403：没有权限访问资源。 404：需要访问的资源不存在。 405：需要访问的资源被禁止。 407：访问的资源需要代理身份验证。 414：请求的URL太长。 500：服务器内部错误。
XMLHttpRequest status = 0 问题。（这部分为copy来的：详细请看：http://blog.csdn.net/iaiti/article/details/42192659）
xmlhttp.readyState =4的时候，一直xmlhttp.status ！= 200。便随手输出，发现xmlhttp.status=0，http协议里可是没这个状态码的。
最后翻啊翻啊，找啊找啊，最后找到一个XMLHttpRequest的说明：http://www.w3.org/TR/XMLHttpRequest/ 。
The status attribute must return the result of running these steps:
status的值一定会返回运行这些步骤的结果。
1、If the state is UNSENT or OPENED, return 0.（如果状态是UNSENT或者OPENED，返回0） 2、If the error flag is set, return 0.（如果错误标签被设置，返回0） 3、Return the HTTP status code.（返回HTTP状态码）
如果在HTTP返回之前就出现上面两种情况，就出现0了
3、 服务器响应
如需获得来自服务器的响应，请使用 XMLHttpRequest 对象的 responseText 或 responseXML 属性
responseText：获得字符串形式的响应数据；
responseXML：获得 XML 形式的响应数据。
// 对XML 对象进行解析
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
var xmlDoc=xmlhttp.responseXML;
var txt="";
var x=xmlDoc.getElementsByTagName("ARTIST");
for (i=0;i<x.length;i++){
txt=txt + x[i].childNodes[0].nodeValue + "<br>";
}
document.getElementById("myDiv").innerHTML=txt;
}
4、向服务器发送请求
open(method,url,async)
规定请求的类型、URL 以及是否异步处理请求。
method：请求的类型；GET 或 POST url：文件在服务器上的位置 async：true（异步）或 false（同步）send(string)
将请求发送到服务器。string:禁用于post请求
与 post相比，get更简单也更快，并且在大部分情况下都能用。
然而，在以下情况中，请使用 post请求：
无法使用缓存文件（更新服务器上的文件或数据库） 向服务器发送大量数据（post没有数据量限制） 发送包含未知字符的用户输入时，post 比 get 更稳定也更可靠.
以上文本纯属自己收集，如有雷同请谅解，如有不妥望指出，谢谢！
------ZhuHuarun
