最近写单页demo,没有用到前端框架和js库,需要ajax原生
get方法
//原生构造ajax请求
let xhr = new XMLHttpRequest();
//请求响应
xhr.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
//网友写的api返回值在responseText里面,但是我的返回值就是response,大家根据自己的情况使用
let res = this.response
}
}
//有参数的直接拼到url上就好了
xhr.open('get','https://www.jianshu.com/u/374ca941200a');
//发送请求
xhr.send();
post方法
//原生构造ajax请求
let xhr = new XMLHttpRequest();
xhr.responseType = 'json';
//post请求需要的参数
let data = new FormData();
data.append('length', length);
//请求响应
xhr.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
//网友写的api返回值在responseText里面,但是我的返回值就是response,大家根据自己的情况使用
let res = this.response
}
}
xhr.open('post','/fa');
//发送请求
xhr.send(data);
Ajax 和 Promise异步
new Promise(function(resolve,reject){
//原生构造ajax请求
let xhr = new XMLHttpRequest();
xhr.responseType = 'json';
//post请求需要的参数
let data = new FormData();
data.append('length', length);
//post需要设置请求头
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset-UTF-8");
//请求响应
xhr.onreadystatechange = function(){
if(this.readyState == 4 && this.status == 200){
resolve(this.response)
}
}
xhr.open('post','/fa/b');
//发送请求
xhr.send(data);
}).then((res)=>{
console.log(res)
},
(err)=>{
console.log(err);
});
网友评论