原生js实现ajax方法(超简单)
作者:jingxian 发布时间:2024-04-19 09:48:27
标签:原生js,ajax
上一篇文章写到原生js取代jquery的一些常用函数:原生js仿jquery一些常用方法,那么,ajax如何实现呢?如下是一个比较完整的ajax()
function ajax(){
var ajaxData = {
type:arguments[0].type || "GET",
url:arguments[0].url || "",
async:arguments[0].async || "true",
data:arguments[0].data || null,
dataType:arguments[0].dataType || "text",
contentType:arguments[0].contentType || "application/x-www-form-urlencoded",
beforeSend:arguments[0].beforeSend || function(){},
success:arguments[0].success || function(){},
error:arguments[0].error || function(){}
}
ajaxData.beforeSend()
var xhr = createxmlHttpRequest();
xhr.responseType=ajaxData.dataType;
xhr.open(ajaxData.type,ajaxData.url,ajaxData.async);
xhr.setRequestHeader("Content-Type",ajaxData.contentType);
xhr.send(convertData(ajaxData.data));
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
if(xhr.status == 200){
ajaxData.success(xhr.response)
}else{
ajaxData.error()
}
}
}
}
function createxmlHttpRequest() {
if (window.ActiveXObject) {
return new ActiveXObject("Microsoft.XMLHTTP");
} else if (window.XMLHttpRequest) {
return new XMLHttpRequest();
}
}
function convertData(data){
if( typeof data === 'object' ){
var convertResult = "" ;
for(var c in data){
convertResult+= c + "=" + data[c] + "&";
}
convertResult=convertResult.substring(0,convertResult.length-1)
return convertResult;
}else{
return data;
}
}
使用格式跟jquery的ajax差不多:
ajax({
type:"POST",
url:"ajax.php",
dataType:"json",
data:{"val1":"abc","val2":123,"val3":"456"},
beforeSend:function(){
//some js code
},
success:function(msg){
console.log(msg)
},
error:function(){
console.log("error")
}
})
0
投稿
猜你喜欢
- 前言最近在使用Python的时候遇到浮点数运算,发现经常会碰到如下情况:出现上面的情况,主要还是因浮点数在计算机中实际是以二进制保存的,有些
- 1.mysql中or语法的使用,在mysql语法中or使用注意点。 项目遇到坑,遍历发放奖励数据查询错误!!!$sql = 'SEL
- 1) 首先安装docker:# 用 yum 安装并启动yum install docker -y && systemctl
- 最近遇到一个问题,是指定参数来运行某个特定的进程,这很类似Linux中一些命令的参数了,比如ls -a,为什么加上-a选项会响应。optpa
- python使用qq邮箱(个人邮箱)发送邮件需开启qq邮箱的SMTP服务在设置中开启pop3/SMTP服务,返回的密码就是之后代码中登录使用
- Prometheus是什么Prometheus是一套开源监控系统和告警为一体,由go语言(golang)开发,是监控+报警+时间序列数据库的
- PHP PDO 事务与自动提交现在通过 PDO 连接上了,在开始进行查询前,必须先理解 PDO 是如何管理事务的。事务支持四大特性(ACID
- 在asp编程中,我们常常使用trim(rtrim ,ltrim)函数去掉一些数据的开头和结尾的空格,笔者最近写了一个asp聊天室,看到下面的
- 一.魔法方法1.属性访问通常可以通过点(.)操作符的形式去访问对象的属性。class C:def __init__(self):self.x
- 字符画是一种由字母、标点或其他字符组成的图画,它产生于互联网时代,在聊天软件中使用较多,本文我们看一下如何将自己喜欢的图片转成字符画。静态图
- Python编程:函数函数是带名字的代码块,用于完成具体的工作。要执行函数定义的特定任务,可调用该函数。需要在程序中多次执行同一项任务时,你
- 1、准备工作安装好Pycharm2017版本电脑上安装好Python解释器2、本地解释器配置配置本地解释器的步骤相对简洁直观:(1)单击工具
- 效果展示数据集展示数据集来源:使用了开源数据集FaceMask_CelebAgithub地址:https://github.com/seve
- code原文档 1.txt :HelloNanjing100实现代码:file_ = "1.txt"r_file = o
- python解析网页,无出BeautifulSoup左右,此是序言安装BeautifulSoup4以后的安装需要用eazy_install,
- 目录MySQL 主备的基本原理binlog 的三种格式对比为什么会有 mixed 格式的 binlog?循环复制问题总结:抛出问题:大家知道
- python是支持多线程的,主要是通过thread和threading这两个模块来实现的。thread模块是比较底层的模块,th
- 概述要访问一个变量的内容,可以直接使用其名称。如果该变量是一个数组,可以使用变量名称和关键字或索引的组合来访问其内容。像其他变量一样,使用运
- 使用PHP开发应用程序,尤其是网站程序,常常需要生成随机密码,如用户注册生成随机密码,用户重置密码也需要生成一个随机的密码。随机密码也就是一
- 前言:Python基础知识+结构+数据类型Python基础学习列表+元组+字典+集合今天的是Python基础学习的第三篇了,前面的知识点给大