分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 前端开发

原生ajax的简单封装(仅提供大概的思路,具体还有参数验证的都没做)

发布时间:2023-09-06 02:35责任编辑:胡小海关键词:暂无标签
window.onload=function(){ ???//get请求======================================================================================== ???function ajaxGet(url,success,fail){ ???????var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("micsoft XMLHttp") ???????xhr.onreadystatechange = function(){ ???????????if(xhr.readyState == 4){ ???????????????if(xhr.status == 200){ ???????????????????success(JSON.parse(xhr.responseText)) ???????????????}else{ ???????????????????fail(xhr.status) ???????????????} ???????????} ???????} ???????xhr.open("get",url,true); ???????xhr.send() ???} ???//post请求======================================================================================= ???function ajaxPost(url,data,success,fail){ ???????var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("micsoft XMLHttp") ???????xhr.onreadystatechange = function(){ ???????????if(xhr.readyState == 4){ ???????????????if(xhr.status == 200){ ???????????????????success(JSON.parse(xhr.responseText)) ???????????????}else{ ???????????????????fail(xhr.status) ???????????????} ???????????} ???????} ???????xhr.open("post",url,true); ???????xhr.send(data) ???} ???//普通调用 ???ajaxPost("https://www.apiopen.top/femaleNameApi",{"page":1},function(res){ ???????console.log(res) ???},function(res){ ???????console.log(res) ???})//-------------------------------------------------------------------------分割线----------------------------------------------------------------------------- ???//面向对象post方法及调用方式================================================================================== ???function Post(obj){ ???????var options = obj ???????var xhr = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("micsoft XMLHttp") ???????xhr.onreadystatechange = function(){ ???????????if(xhr.readyState == 4){ ???????????????if(xhr.status == 200){ ???????????????????options.success(JSON.parse(xhr.responseText)) ???????????????}else{ ???????????????????options.fail(xhr.status) ???????????????} ???????????} ???????} ???????xhr.open(options.method,options.url,options.async); ???????xhr.send(options.data) ???} ???//调用 ???Post({ ???????method:"post", ???????url:"https://www.apiopen.top/femaleNameApi", ???????data:{"page":1}, ???????async:true, ???????success:function(res){ ???????????console.log(res) ???????},fail:function(res){ ???????????console.log(res) ???????} ???})}

原生ajax的简单封装(仅提供大概的思路,具体还有参数验证的都没做)

原文地址:https://www.cnblogs.com/helloNico/p/10579022.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved