我们在jquery中一般是这样是用ajax函数的:
xxx.addEventListener('click', function(){
window.ajax({
url:'/xxx',
method: 'get',
body: '', //请求体,method为get可以为空
headers: { //请求头
'content-type': 'application/x-www-form-urlencoded'
},
successFn: function() {
console.log(success)
},
failFn: function() {
console.log(fail)
}
})
})
基于上面的代码我们封装一个window.ajax函数
window.ajax = function(options) {
let {url, method, body, headers, successFn, failFn} = options
let xhr = new XMLHttpRequest()
xhr.open(method, url)
for(key in headers) {
let value = headers[key]
xhr.setRequestHeader(key, value)
}
xhr.onreadystatechange = function() {
if(xhr.readyState === 4) {
if(xhr.status >= 200 && xhr.status < 300) {
successFn.call(undefined, xhr.responseText)
} else if(xhr.status >= 400) {
failFn()
}
}
}
xhr.send(body)
}