AJAX学习
名称：AJAX=Asynchronous JavaScript and Xml (异步的JavaScript和Xml)
特点：与服务器交互更新部分网页且不用重新加载整个页面
1：创建XMLHttpRequest对象
    XMLHttpRequest对象用于在后台和服务器交换数据
    现代浏览器IE7+、Firefox、Chrome、Safari、以及Opera均内建XMLHttpRequest
    IE5和6用ActiveXObject
    
    var xmlhttp;
    if(window.XMLHttpRequest){
        xmlhttp = new XMLHttpRequest();
    }else{
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
注： window是顶级对象（除object,function等）window代表了一个窗体，XMLHttpRequest是window的一个属性用来区分浏览器

2：XMLHttpRequest向服务器发送请求


    xmlhttp.open(method,url,async);
    xmlhttp.send();


    
    方法                                         描述
    
    open(method,url,async)           规定请求的类型、URL 以及是否异步处理请求。
                                          　　 method：请求的类型；GET 或 POST
                                                 url：文件在服务器上的位置
                                            　  async：true（异步）或 false（同步）

    send(string)                             将请求发送到服务器。
                                      　　      string：仅用于 POST 请求

    get和post的区别：
    1>.get简单更快
    2>.在以下情况中，请使用 POST 请求：
        1.无法使用缓存文件（更新服务器上的文件或数据库）
        2.向服务器发送大量数据（POST 没有数据量限制）
        3.发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠
    
        
    如果需要像 HTML 表单那样 POST 数据，请使用 setRequestHeader() 来添加 HTTP 头。然后在 send() 方法中规定您希望发送的数据:
        方法                                         　　　　描述
        setRequestHeader(header,value)           向请求添加 HTTP 头。
                                          　　　　　　　　  header: 规定头的名称
                                          　　　　　　　　  value: 规定头的值

        
        
        eg：
            xmlhttp.open("POST","ajax_test.asp",true);
            xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
            xmlhttp.send("fname=Bill&lname=Gates");
            
3：XMLHttpRequest响应
    通过XMLHttpRequest对象的responseText（获得字符串形式的响应数据）或者responseXML（获得XML形式的响应数据）
    若服务器响应的是XML，则对XML对象进行解析
        eg：    
            xmlDoc=xmlhttp.responseXML;
            var txt="";
            var x=xmlDoc.getElementsByTagName("tittle");
            for(var i=0;i<x.length;i++){
                txt=txt + x[i].childNodes[0].nodeValue + "<br />";
                //x[i].childNodes[0].nodeValue 获取元素第一个子节点的值
            }
            document.getElementById("myDiv").innerHTML=txt;
        
4：AJAX - onreadystatechange 事件
    
    XMLHttpRequest对象的三个属性：
    
    
    属性                             　　　　 描述

    onreadystatechange                存储函数（函数名），每当readyState属性发生改变时，就会调用该函数。
    readyState                       　　 存有XMLHttpRequest的状态，从0到4发生变化
                                      　　　　  0：请求未初始化；
                                      　　　　  1：服务器连接已建立
                                      　　　　  2：请求已接收
                                     　　　　   3：请求处理中
                                    　　　　    4：请求完成且响应就绪
                                        
    status                          　　  200：“OK”
                                  　　　　  404：未找到页面


    当readyState等于4且status为200时，表示响应已就绪
    
    
    
    Callback函数
    
    如果您的网站上存在多个 AJAX 任务，那么您应该为创建 XMLHttpRequest 对象编写一个标准的函数，并为每个 AJAX 任务调用该函数。
    该函数调用应该包含 URL 以及发生 onreadystatechange 事件时执行的任务（每次调用可能不尽相同）：
    
    <script type="text/javascript">
        var xmlhttp;
        function loadXMLDoc(url,cfunc)
        {
        if (window.XMLHttpRequest)
          {// code for IE7+, Firefox, Chrome, Opera, Safari
          xmlhttp=new XMLHttpRequest();
          }
        else
          {// code for IE6, IE5
          xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
          }
        xmlhttp.onreadystatechange=cfunc;
        xmlhttp.open("GET",url,true);
        xmlhttp.send();
        }
        function myFunction()
        {
        loadXMLDoc("/ajax/test1.txt",function()
          {
          if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
            }
          });
        }
    </script>