- 創建xhr對象: new XHRHttpRequest()
xhr對象的屬性:
responseText: 代表響應主體的響應文本;
status: 返回狀態碼, 200: ok, 404:錯誤…
同步方式
xhr.open('get','test.php?rand=Math.random()',false); // false:同步
xhr.send(null);
異步方式
onreadystatechange事件監聽;
檢測readState狀態;
xhr.onreadstatechange = function(){
if(xhr.readyState==4 && xhr.status==200){
console.log(xhr.responseText);
}
}
xhr.open('get','test.php',true);
xhr.send(null);
GET
web上, get一般是URL提交請求;
如demo.php?name=Lee&age=100
Post
POST一般是表單提交;
如:<form method="post"><input type="text" name="name" value=...>
xhr.onreadstatechange = function(){
if(xhr.readyState==4 && xhr.status==200){
console.log(xhr.responseText);
}
}
xhr.open('post','test.php',true);
// 修改請求頭,模擬表單提交
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded')
xhr.send('name=Lee&age=10'); // 通過這裏提交數據
頭信息
- 響應頭信息: 服務器返回的信息, 客戶端可以獲取但不可設置;
- 請求頭信息: 客戶端可以設置但不獲取;
全部響應頭信息:xhr.getResponseHeaders()
獲取響應頭信息內容:xhr.getResponseHeader('Contnet-Type')
設置:xhr.setResponseHeader(key,value)
特殊字符編碼
如字符中包含’&’, 則需要對其進行編碼,否則會出現問題: encodeURIComponent(name);