$.ajax({url:'',//請求文件路徑type:'',//請求方式GET POSTdata:{},//要發給服務器的數據參數dataType:'',//希望接口返回的數據格式json,string等等success:function(){// 請求成功的回調},error:function(){// 請求失敗的回調} })一個ajax的請求可以形象的比喻為一次打電話的過程：//1 拿出手機 創建XMLHttpRequest對象 //2 撥號 連接到服務器 //3 說話 發送請求 //4 等待對方回應 服務器響應請求//1 拿出手機 創建XMLHttpRequest對象 if(window.XMLHttpRequest){var OAjax = new XMLHttpRequest() }else{// 兼容ie6及以下寫法var OAjax = new ActiveXObject("Misrcsoft.XMLHTTP") }//2 撥號 連接到服務器 OAjax.open('GET','a.html?t="new Date().getTime()"','true');//請求方式，請求路徑,t為了消除 緩存，是否異步//3 說話 發送請求 OAjax.send();//4 等待對方回應 服務器響應請求 //4 等待對方回應 服務器響應請求 OAjax.onreadystatechange = function(){//OAjax.readyState,監聽瀏覽器和服務器之間的交互到哪一步了// 0->未初始化，還沒有調用open方法// 1->載入，已調用send()方法，正在發送請求// 2->載入完成，send()方法已完成，已收到全部響應內容// 3->解析，解析響應的內容// 4->完成，相應內容解析完成，可以在客戶端調用if(OAjax.readyState == 4){if(OAjax.status == 200){// 請求a.html成功，responseText為服務器響應的內容console.log('ajax請求成功',OAjax.responseText);}else{// 狀態不為200console.log('ajax請求失敗');}} }

原生ajax

AJAX = Asynchronous JavaScript and XML（異步的 JavaScript 和 XML）。AJAX 不是新的編程語言，而是一種使用現有標準的新方法。AJAX 是與服務器交換數據并更新部分網頁的藝術，在不重新加載整個頁面的情況下。所有現代瀏覽器均支持 XMLHttpRequest 對象（IE5 和 IE6 使用 ActiveXObject）。XMLHttpRequest 用于在后臺與服務器交換數據。這意味著可以在不重新加載整個網頁的情況下，對網頁的 某部分進行更新。ajax原生版，兼容所有瀏覽器：function loadXMLDoc(url){xmlhttp=null;if (window.XMLHttpRequest){// code for Firefox, Opera, IE7, etc.xmlhttp=new XMLHttpRequest();}else if (window.ActiveXObject){// code for IE6, IE5xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");}if (xmlhttp!=null){xmlhttp.onreadystatechange=state_Change;xmlhttp.open("GET",url,true);//method：請求的類型；GET 或 POST。 async：true（異步）或 false（同步）xmlhttp.send(null);//string：僅用于 POST 請求xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded"); //添加請求頭。}else{alert("Your browser does not support XMLHTTP.");} }function state_Change(){if (xmlhttp.readyState==4){// 4 = "loaded"if (xmlhttp.status==200){// 200 = "OK"document.getElementById('T1').innerHTML=xmlhttp.responseText;}else{alert("Problem retrieving data:" + xmlhttp.statusText);}} }1.responseText 獲得字符串形式的響應數據。2.responseXML 獲得 XML 形式的響應數據。3.onreadystatechange 存儲函數（或函數名），每當 readyState 屬性改變時，就會調用該函數。4.readyState 存有 XMLHttpRequest 的狀態。從 0 到 4 發生變化。0: 請求未初始化 1: 服務器連接已建立 2: 請求已接收 3: 請求處理中 4: 請求已完成，且響應已就緒5.status200: "OK" 404: 未找到頁面簡化ajax模版，便于工作中調用：function loadAjax(url,box){// code for IE7+, Firefox, Chrome, Opera, Safari || code for IE6, IE5var req = new XMLHttpRequest() || new ActiveXObject("Microsoft.XMLHTTP");req.open("GET",url,true); //post 中文路徑會報錯。req.send();req.onreadystatechange = function(){if(req.readyState==4&&req.status==200){box.innerHTML=req.responseText;}} }注：沒有readyState和status錯誤提示。

原生ajax請求

(1)創建`XMLHttpRequest`對象,也就是創建一個異步調用對象. (2)創建一個新的`HTTP`請求,并指定該`HTTP`請求的方法、`URL`及驗證信息. (3)設置響應`HTTP`請求狀態變化的函數. (4)發送`HTTP`請求. (5)獲取異步調用返回的數據. (6)使用JavaScript和DOM實現局部刷新.var XMLHttp = new XMLHttpRequest () XMLHttp.open = ("請求的方法（get\post）" ,"URL" , "async(ture異步/false同步)") xmlHttp.send() xmlhttp.onreadystatechange=function () {//接收到服務端響應時觸發 if(xmlhttp.readyState==4&&xmlhttp.status==200){ } xmlhttp.readyState一共有5中請求狀態，從0 到 4 發生變化。0: 請求未初始化 1: 服務器連接已建立 2: 請求已接收 3: 請求處理中 4: 請求已完成，且響應已就緒xmlhttp.status200: "OK" 300 這些狀態碼用來重定向 401 當前請求需要用戶驗證 403 （禁止） 服務器拒絕請求。 404 （未找到） 服務器找不到請求的網頁。 408 （請求超時） 服務器等候請求時發生超時。 500 （服務器內部錯誤） 服務器遇到錯誤，無法完成請求。

原生ajax

原生ajax的工作流程是怎么樣的？要發一個ajax請求首先要創建XMLHttp對象var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP")其中，new ActiveXObject("Microsoft.XMLHTTP")是為了兼容ie5/6的對象然后調用對象的open方法來規定請求的類型、URL 以及是否異步處理請求xmlhttp.open("GET","localhost:3000/package.json",true)如果你async字段寫的true，也就是發起的是異步請求，那么要寫onreadystatechange事件來監聽請求的 狀態，每當 readyState 屬性改變時，就會調用該函數onreadystatechange函數實例，主要就是根據readyState和status的判斷來處理返回的responseTextxmlhttp.onreadystatechange=function(){if (xmlhttp.readyState==4 && xmlhttp.status==200){document.getElementById("myDiv").innerHTML=xmlhttp.responseText;} }最后調用send將請求發給服務器如果是get請求，參數是在url后面直接添加的如果想自定義header的字段，可以在發送之前用setRequestHeader(header,value)向請求添加http頭

?

總結

以上是生活随笔為你收集整理的对原生ajax的理解的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。