function ajax (options) {
var defaults = {
type:'get',
url:'',
data:'',
header:{
'Content-Type':'application/x-www-form-urlencoded'
},
success: function(){},
error: function(){}
}
// 使用options中的属性覆盖defaults中的属性
Object.assign(defaults,options)
//创建ajax对象
var xhr = new XMLHttpRequest();
//拼接请求参数变量
var params = '';
for(var attr in defaults.data){
params += attr + '=' + defaults.data[attr] + '&';
}
//截取字符串,去掉最后一个&符号
params = params.substr(0,params.length-1);
//判断请求方式
if(defaults.type == 'get'){
defaults.url = defaults.url + '?' + params;
}
//配置ajax对象
xhr.open(defaults.type, defaults.url)
//判断请求方式为post
if(defaults.type == 'post'){
//用户希望向服务器端传递的请求参数
var contentType = defaults.header['Content-Type']
//设置请求参数格式类型
xhr.setRequestHeader('Content-Type', contentType);
if(contentType == 'application/json'){
xhr.send(JSON.stringify(defaults.data))
}else{
xhr.send(params)
}
}else{
xhr.send();
}
//监听xhr下的onload事件
xhr.onload = function (){
//获取响应头部中的数据来判断返回的数据类型
var contentType = xhr.getResponseHeader('Content-Type');
var respondText = xhr.responseText;
//如果响应数据类型包括application/json
if(contentType.includes('application/json')){
responseText = JSON.parse(respondText)
}
//当http状态码为200时
if(xhr.status == 200){
defaults.success(responseText,xhr)
}else{
defaults.error(responseText,xhr);
}
}
}
ajax({
// type:'post', //默认get请求,需要用post请求可以写出来
url:'填写自己的api接口',
success: function(data){ //请求成功回调
console.log(data);
}
})