本文将详细解释如何使用JavaScript来定义您自己的ajax函数。边肖觉得很实用,分享给大家参考。希望你看完这篇文章能有所收获。
由于原生js发起的网络请求都是以查询字符串的形式提交给服务器的,用户以对象的形式提交参数更方便,所以需要对用户传递的参数对象进行处理,定义resolveData的函数,设置参数接收参数,遍历内部对象,用=拼接键和值,然后将得到的值加入到空数组中。最后,用符号划分数组的每一项并返回;定义itheima函数,设置用于接收用户传递的配置对象参数的参数,创建xhr对象,将传递的参数传递给处理参数的函数,并将获得的返回值赋予一个变量。因为是不同的请求,所以需要先判断参数中的方法是否都等于GET。因为传递的参数可能是小写的,所以通过to uppercase方法将它们转换为大写。如果满足条件,则调用open方法并将其转换为大写。POST也是如此,只是提交的数据有更多的参数,POST请求需要一个“Content-Type”头来指定请求主题的MIME类型。最后,调用监控事件;
函数解析数据(数据){ 0
var arr=[];
for(varkindata){ 0
var str=k '=' data[k];
arr.push(str)
}
returnarr.join(“”)
}
functionitheima(选项){ 0
varxhr=Newxmlhttprequest();
varqs=resolveData(options . data);
if(options . method . touppercase()===' GET '){ 0
xhr.open(options.method,options.url '?'QS);
xhr . send();
} else if(options . method . touppercase()===' POST '){ 0
xhr.open(options.method,options.url)
xhr . setrequestheader(' Content-Type ',' application/x-www-form-URL encoded ')
xhr.send(qs)
}
xhr . onreadystatechange=function(){ 0
if(xhr . readystate===4xhr . status===200){ 0
var result=JSON . parse(xhr . responsetext)
选项成功(结果);
}
}
}最后测试一下会不会成功~
!DOCTYPEhtml
htmllang='en '
头
metachartset=' UTF-8 '
meta http-equiv=' X-UA-Compatible ' content=' IE=edge '
元名称=“视口”内容=“宽度=设备宽度,初始比例=1.0”
标题测试界面/标题
scriptsrc='itheima.js'/script
/head
身体
脚本
ithe IMA({ 0
method:'GET ',
URL : ' http://www . Liu long bin . top :3006/API/getbooks ',
数据:{
id:1
},
成功:功能()
console . log(RES);
}
});
/script
/body
/html
这篇关于“如何用JavaScript定义自己的ajax函数”的文章就分享到这里。希望
内容来源网络,如有侵权,联系删除,本文地址:https://www.230890.com/zhan/115597.html