- 此API为复习Promise和AJAX时将两者整合,用以获取数据后再异步调用resolve对数据进行处理。其实用jQuery直接$.ajax({success: function(){效果也一样}}),或者axios.get(‘url’).then()也可以实现。
<script>
function ajax(method, url, params) {
//调用ajax会返回一个Promise,以便获取数据后利用then进行操作
return new Promise((resolve, reject) => {
method = method.toUpperCase()
//用以存放便利后的键值对儿
const temp = []
for (let key in params) {
temp.push(key + "=" +params[key])
}
//将各提交数据用&隔开
let queryString = temp.join("&")
const xhr = window.XMLHttpRequest ? new XMLHttpRequest : new ActiveXObject('microsoft.XMLHttp')
//把提交的数据和url整合
url = url + "?" + queryString
xhr.open(method, url)
xhr.onreadystatechange = function () {
if (this.readyState === 4 && this.status === 200) {
try {
resolve(JSON.parse(this.responseText))
} catch (e) {
resolve(this.responseText)
}
}
}
//data用以存放提交的表单数据,GET时为null
let data = null;
if (method === "POST") {
xhr.setRequestHeader('Content-Type','application/x-wwww-form-urlencoded')
data = queryString
}
xhr.send(data)
}
)}
ajax('get', 'http://127.0.0.1:3000', {name: "czg"}).then(data => { console.log('我成功了') })
</script>
```