Ajax(異步的javascript和XML),若干年以前它的出現使得javascript重新得到程序員們的重視，它終結了用戶“單擊，等待”的交互過程，通過異步模式，讓用戶在單擊(形如表單提交,添加購物車等需要與后臺交互的動作)之后仍能進行其他操作而不是要等服務器響應完后才能進行后續操作。 <br> ### Ajax的核心—XMLHttpRequest * * * * * 可以說Ajax的精華部分就是它的XMLHttpRequest對象，為了方便起見簡稱XHR對象。 既然是對象，那么它就有原生的屬性和方法 1. readyState：請求/響應過程的當前活動階段 0：未初始化，尚未調用open()方法 1：啟動，已經調用open()，但尚未調用send() 2：發送，已經調用send，但尚未接收到響應 3：接受，已經接受部分響應數據 4：完成，已經接受全部數據，而且已經可以在客戶端使用 2. status：響應的Http狀態，例如200,404,304等 3. open方法：接收三個參數，分別是：請求方式，請求的url，同步還是異步(false or true) 4. send方法：接收一個參數，如果用get方式的話參數可以不寫或者是null，如果用post方式的話參數是請求的數據。 5. responseText：服務器返回的數據 6. onreadystatechange事件：每當readystate的值發生改變都會觸發一次該事件。 打開控制臺可以看到Http頭部信息   一個簡單的Ajax實例： ~~~ document.getElementById('ajax').addEventListener('click',function() { var xml=new XMLHttpRequest(); xml.onreadystatechange=function() { if(xml.readyState==4 && xml.status==200) { console.log(xml.responseText); } }; xml.open("get","user.json"); xml.send();}) ~~~ <br> ### 細說POST和GET的區別 * * * * * GET請求 1. GET方式直接將請求的數據添加在URL的末尾 ~~~ xml.open('GET',"ajax.php?number="+document.getElementById('keybord').value); xml.send(); ~~~ 2.GET請求發送數據量小 3.請求數據，用于查詢信息，也就是取數據 4.GET請求發送后被緩存 <br> POST請求 1. POST方式模仿form的表單提交，所以要設置Content-Type頭部信息為application/x-222-form-urlencoded， `xml.setRequestHeader("Content-Type","application/x-www-form-urlencoded");` ~~~ xml.open('POST','ajax.php'); var data="name="+document.getElementById("stuffname").value+ "&number="+document.getElementById("stuffnumber").value+ "&sex="+document.getElementById("stuffsex").value+ "&job="+document.getElementById("stuffjob").value; xml.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); xml.send(data); ~~~ 2. POST請求發送數據量大 3. 用于向服務器發送被保存的數據，也就是存數據 4. POST沒有緩存 注意：如果post的是表單，則需要先對表單對象進行序列化，可以使用jQuery中的serialize()方法，也可以用原生的js封裝。