原生js ajax實現
阿新 • • 發佈:2018-11-22
- 例項化XMLHttpRequet
var request = new XMLHttpRequest();
- 呼叫XMLHttpRequet物件的open方法,引數【方法,url】
request.open("GET","data.scv");
如果有請求頭需設定請求頭
request.setRequestHeader("Content-Type","text/plain");
- 向伺服器傳送請求
request.send(null);//get請求沒有請求主體,傳null或者省略這個引數
例子:
//post傳送文字給伺服器 function(msg) { var request = new XMLHttpRequest(); request.open("POST","/log.php"); request.setRequestHeader("Content-Type","text/plain;charset=UTF-8"); request.send(msg) }
-
取得響應
通過監聽XMLHttpRequet物件上的readyState事件,readyState是一個整數,指定http請求狀態。
0 open()尚未呼叫
1 open()已呼叫
2 接收到頭的資訊
3 接收到響應主體
4 響應完成每次readyState都會觸發readystatechange事件,實際上readystate改變為0或1時可能沒有觸發這個事件,
//傳送get請求獲得url內容 function getText(url){ var request = new XMLHttpRequest(); request.open("POST",url,false);//傳送非同步請求 request.send(null);//立即傳送請求 if (request.status !== 200) { throw new Error("request.statusText"); } var type = request.getResponseHeader("Content-type"); if (!type.match(/^text/)) throw new Error("Response Type is:" + type) return request.responseText; }