使用原生JavaScript来封装ajax请求
时间: 2023-12-13 09:26:19 浏览: 111
非常欢迎您的提问!关于使用原生JavaScript来封装ajax请求,是一个很常见的问题。对于这个问题,我可以给您提供以下的思路和代码示例,帮助您更好地理解和实现:
思路:
1. 创建XMLHttpRequest对象
2. 设置请求参数,包括请求方法、请求URL、异步标识、请求头部等
3. 发送请求,并且设置回调函数,处理返回结果或者异常情况
4. 处理回调函数中的数据,例如更新页面、显示提示信息、打印日志等
代码示例:
function ajax(url, options) {
var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
options.success(xhr.responseText);
} else {
options.error(xhr.status);
}
}
}
xhr.open(options.method, url, options.async);
for (var header in options.headers) {
xhr.setRequestHeader(header, options.headers[header]);
}
xhr.send(options.data);
}
// 使用示例
ajax('https://api.example.com/getData', {
method: 'GET',
async: true,
headers: {
'Content-Type': 'application/json'
},
data: null,
success: function(responseText) {
console.log(responseText);
},
error: function(status) {
console.error('ERROR: ' + status);
}
});
希望以上的思路和代码示例对您有所帮助!如果您有任何其他问题,也欢迎随时向我提问。
阅读全文