创建ajax对象

-GET or POST
与 POST 相比，GET 更简单也更快，并且在大部分情况下都能用。
然而，在以下情况中，请使用 POST 请求：
1.无法使用缓存文件（更新服务器上的文件或数据库）
2.向服务器发送大量数据（POST 没有数据量限制）
3.发送包含未知字符的用户输入时，POST 比 GET 更稳定也更可靠

-JS原生get方式：

function loadXMLDoc() {
    // 获取ajax对象
  var xmlhttp=new XMLHttpRequest();
  xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
    var responseText = xmlhttp.responseText;
    }
  }
  // 为了避免得到的是缓存的结果，请向 URL 添加一个唯一的 ID：   
  xmlhttp.open("GET","/try/ajax/ajaxGet.php?t=" + Math.random(),true);
  xmlhttp.send();
}

-JS原生post方式：

//1.获取ajax对象
        var xhr = new XMLHttpRequest();
        //2.设置请求地址
        xhr.open('post', 'ajaxPost.php',true);
        //3.post方式设置方法头，get不需要
        xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded');
        //4.发送
        xhr.send('name='+name);
        //5注册事件
        xhr.onreadystatechange=function(){
            //处理返回值
            if(xhr.readyState == 4 && xhr.status == 200){
                var responseText = xhr.responseText;
            }
        }

-如果页面存在多个 ajax任务：
回调函数是一种以参数形式传递给另一个函数的函数。
如果您的网站上存在多个 AJAX 任务，那么您应该为创建 XMLHttpRequest 对象编写一个标准的函数，并为每个 AJAX 任务调用该函数。
该函数调用应该包含 URL 以及发生 onreadystatechange 事件时执行的任务（每次调用可能不尽相同）：

function loadXMLDoc(url,cfunc)
{
// IE7+, Firefox, Chrome, Opera, Safari 代码
  var xmlhttp=new XMLHttpRequest();
xmlhttp.onreadystatechange=cfunc;
xmlhttp.open("GET",url,true);
xmlhttp.send();
}
function myFunction()
{
    loadXMLDoc("/try/ajax/ajax_info.txt",function()
    {
        if (xmlhttp.readyState==4 && xmlhttp.status==200)
        {
            document.getElementById("myDiv").innerHTML=xmlhttp.responseText;
        }
    });
}

//html部分
<button type="button" onclick="myFunction()">修改内容</button>