一、定義
1、JavaScript對(duì)象，主流瀏覽器都在支持（ie11以上）
2、JavaScript腳本與服務(wù)器端交互數(shù)據(jù)的API接口
二、屬性
1、readyState?
XMLHttpRequest對(duì)象的處理狀態(tài)，狀態(tài)值從0到4 五個(gè)狀態(tài)
0：表示XMLHttpRequest已經(jīng)初始化
var xhr = new XMLHttpRequest()
1：表示open()方法已經(jīng)調(diào)用
xhr.open(
'MethodName(string/必須)', ? ? ? ? ? ? ? ? ? ?// 請(qǐng)求HTTP的方法名（GET/POST/HEAD/DELETE/OPTION）
'URL(string/必須)', ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? // 請(qǐng)求主題 ?請(qǐng)求資源的標(biāo)識(shí)符
'async(boolean/非必須)' ? ? ? ? ? ? ? ? ? ? ? ? ? ?// 請(qǐng)求是否是異步（默認(rèn)是true）
'name(string/非必須)', ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? // 用戶名（用于服務(wù)器端驗(yàn)證）
'password(string/非必須)') ? ? ? ? ? ? ? ? ? ? ? ? //密碼（用于服務(wù)器端驗(yàn)證）
2：表示 send()方法已經(jīng)調(diào)用
xhr.send(Data) ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? // 要發(fā)送的數(shù)據(jù)
3：表示XMLHttpRequest對(duì)象開始讀取服務(wù)器的響應(yīng)
4：表示XMLHttpRequest對(duì)象讀取服務(wù)器響應(yīng)結(jié)束
2、status
響應(yīng)狀態(tài)碼(服務(wù)器端的狀態(tài)返回)
0: ? ?在http返回前關(guān)閉/取消，或者防火墻等原因，會(huì)造成http請(qǐng)求沒有status信息
1xx:信息響應(yīng)類，表示接收到請(qǐng)求并且繼續(xù)處理。
2xx:處理成功響應(yīng)類，表示動(dòng)作被成功接收、理解和接受。
3xx:重定向響應(yīng)類，為了完成指定的動(dòng)作，必須接受進(jìn)一步處理 。
4xx:客戶端錯(cuò)誤，客戶請(qǐng)求包含語法錯(cuò)誤或者是不能正確執(zhí)行 。
5xx:服務(wù)端錯(cuò)誤，服務(wù)器不能正確執(zhí)行一個(gè)正確的請(qǐng)求。
readyState屬于XMLHttpRequest大的狀態(tài)分類，
status屬于服務(wù)器端的響應(yīng)狀態(tài)碼，描述問題更加詳細(xì)。
3、statusText
響應(yīng)狀態(tài)碼 后面的文本信息?
如 OK
4、timeout
超時(shí)時(shí)間（表示一個(gè)請(qǐng)求在被自動(dòng)終止前所消耗的毫秒數(shù)）
默認(rèn)為0 表示沒有超時(shí)時(shí)間
5、upload
html5的新增的接口，用于文件上傳（后文會(huì)有介紹）
6、withCredentials
boolean值，表示在進(jìn)行跨站的訪問控制請(qǐng)求時(shí)，是否使用認(rèn)證信息。默認(rèn)為false。注意：這不會(huì)影響同站same-site請(qǐng)求。
7、response
XMLHttpRequest接收到的響應(yīng)體,如果沒有接收到數(shù)據(jù)，就是空字符串。
8、responseText
XMLHttpRequest接收到的響應(yīng)體,如果沒有接收到數(shù)據(jù)，就是空字符串。
9、responseXML
XMLHttpRequest接收到的響應(yīng)體,解析為XML,并作為Document對(duì)象返回。
10、 responseURL
響應(yīng)體的URL
11、responseType
響應(yīng)體類型
二、方法
1、初始化對(duì)象
var xhr=new XMLHttpRequest()
2、xhr.open() ?用于驗(yàn)證請(qǐng)求的方法
請(qǐng)看上面readyState里的詳解
3、setRequestHeader(key,value)
open()方法之后就可以設(shè)置請(qǐng)求頭
4、send(data) 方法請(qǐng)求
1）data:想要發(fā)送的數(shù)據(jù)（沒有需要傳遞的數(shù)據(jù)時(shí)，傳?null表示空）
2）傳遞的參數(shù)類型都是字符串，否則服務(wù)器端接收不到
3）通過設(shè)置請(qǐng)求頭Content-Type的類型可以告知服務(wù)器端是何種類型的文件
5、abort()
終止XMLHttpd對(duì)象對(duì)HTTP的請(qǐng)求，把XMLHttpRequest對(duì)象恢復(fù)到初始狀態(tài)
如果readyState的值是4的話，這個(gè)方法就沒用了（4表示XMLHttpRequest讀取服務(wù)器端響應(yīng)已經(jīng)結(jié)束）
6、getResponseHeader()
HEAD請(qǐng)求忽略內(nèi)容，所以其響應(yīng)比對(duì)GET或POST響應(yīng)小
7、getAllResponseHeaders()
獲取所有請(qǐng)求頭信息（處于安全考慮，有些頭信息獲取不到，可通過服務(wù)器端設(shè)置）
三、事件
1、onreadystatechange
設(shè)置或取回該異步請(qǐng)求的句柄（異步，不可撤銷）
2、ontimeout
當(dāng)存在一個(gè)阻止這個(gè)請(qǐng)求的錯(cuò)誤時(shí)，該事件被喚醒（異步，不可撤銷）
四、難點(diǎn)講解
1、send(data)中的data
1） 設(shè)置requestHeader中Content-Type鍵值 設(shè)置請(qǐng)求data的數(shù)據(jù)類型
<1>參數(shù)鍵值對(duì)化 （鍵值對(duì)化，原生表單控件的基本參數(shù)類型）
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded;charset=utf-8');
<2>json?（json字符串?）
注意一點(diǎn)?標(biāo)準(zhǔn)的json字符串格式
var jsonString="{'name':'xxx'}"
var jsonString=JSON.stringify({name:'xxx'});
xhr.setRequestHeader('Content-Type', 'application/json;charset=utf-8');
<3>form-data 一般用于數(shù)據(jù)上傳
xhr.setRequestHeader('Content-Type','multipart/form-data;charset=utf-8');
<4> 字符串
xhr.setRequestHeader('Content-Type','text/plain;charset=UTF-8');
2)Formdata （定義表單數(shù)據(jù)，下文有介紹）
var formData = new FormData()
formData.append('name','test')
formData.append('filename','fileInput')
xhr.send(formData)
以上就是XMLHttpRequest對(duì)象的基礎(chǔ)知識(shí)，下篇博文將系統(tǒng)的介紹XMLHttpRequest上傳與下載的相關(guān)知識(shí)。博文連接：XMLHttpRequest文件上傳
