AJAX

1、ajax简介：
ajax=asynchrinous javascript and xml（异步js和xml）
ajax不是新的编程语言，是一种现有标准的新方法。
ajax是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。

2、什么事Ajax？
ajax=异步js和XML。
ajax是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量的数据交换，AJax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对页面的某部分进行更新。
传统网页（不适用ajax）如果要更新内容必须加载整个页面。

3.AJAX是基于现有的因特标准
AJAX是基于现有的internet标准，并且联合它们：
XMLHttpRequest对象（异步的与服务器交换数据）
js/dom（信息显示、交互）
css（给数据定义样式）
xml（作为转换数据的格式）
ajax应用程序与浏览器和平台无关！

4、在2005年，谷歌通过GOOGLE SUGGEST使ajax流行起来。
使AJAX传造出动态性极强的web界面

5、AJAX-创建XMLHttpRequest对象
xmlhttprequest是ajax的基础。所有现代浏览器均支持（IE5，6使用ActiveXObject）.Xhr用于后台与服务器交换数据，这意味着可以在不重新加载整个页面的情况下，对网页的某部分进行更新。

6、AJAX-向服务器发送请求
XHR对象用于和服务器交换数据
如果需要请求发送到服务器，我们使用XMLHttpRequest对象的open()和send()方法：
xmlhttp.open("GET","AJAX_INFO.txt"，true);
xmlhttp.send();
open("method","url","async");
规定请求类型、url以及是非异步处理
send(string)将请求发送到服务器，string：仅用于post请求

7、get相对于post来说更加快，大部分情况都能用，向服务器发送大量数据使用post 。post相对于get来说要更加稳定可靠

9.AJAX - 服务器 响应

如需获得来自服务器的响应，请使用XMLHttpRequest 对象的 responseText(获得字符串形式的响应数据。) 或 responseXML 属性。(获得 XML形式的响应数据。)

responseXML 属性

xmlDoc=xmlhttp.responseXML;
txt="";
x=xmlDoc.getElementsByTagName("ARTIST");
for (i=0;i<x.length;i++) {
txt=txt + x[i].childNodes[0].nodeValue + "
";
}
document.getElementById("myDiv").innerHTML=txt;

10.AJAX - onreadystatechange 事件

onreadystatechange 事件
当请求被发送到服务器时，我们需要执行一些基于响应的任务。
每当 readyState改变时，就会触发onreadystatechange事件。
readyState属性存有 XMLHttpRequest 的状态信息。

readyState:
存有 XMLHttpRequest 的状态。从 0 到 4 发生变化。
0: 请求未初始化
1: 服务器连接已建立
2: 请求已接收
3: 请求处理中
4: 请求已完成，且响应已就绪

status:
200: "OK"
404: 未找到页面

  <script type="text/javascript" >
    function CreateXMLHTTP() {
        var objXmlHttp;
        // 检测MSXMLHTTP版本，为了兼容IE各个版本
        var activeKey = new Array("MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0", "MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP", "Microsoft.XMLHTTP");
        if (window.ActiveXObject) {
            for (var i = 0; i < activeKey.length; i++) {
                try {
                    objXmlHttp = new ActiveXObject(activeKey[i]);
                    if (objXmlHttp != null)
                        return objXmlHttp;
                }
                catch (error) {
                    throw new Error("您的浏览器版本过低，请更新浏览器");
                }
            }
        }
        else if (window.XMLHttpRequest) {
            objXmlHttp = new XMLHttpRequest();
        }
        return objXmlHttp;
    }
</script>

post方式：

QQ图片20170101192854.png

get方式：

QQ图片20170101192953.png