js 原生手写AJAX
前言:最近在学习react,在练习中模拟一个button通过AJAX向后台发送POST请求,懒得引入AXIOS,就顺便练习了js原生ajax。
正文:
注:我忽略了IE6及以下版本
submit(){
let data = this.props.value //这是要发送的数据
let xmlHttp = new XMLHttpRequest() //new XMLHttpRequest 对象
//发送请求
xmlHttp.open('POST', 'ajax_test.asp', true) //true是异步请求,false是同步的请求,不建议
xmlHttp.setRequestHeader('name', 'formData') //由于是提交form表单,最好set一个http头部。
xmlHttp.send(data) //只有在POST时候有参数,参数是string类型的数据,get方法并没有。 //接收相应 responseText 和 responseXML 属性
let response = xmlHttp.responseText
xmlHttp.onreadystatechange = function () {
if (xmlHttp.readyState === 4 && xmlHttp.status === 200) {
alert('成功'+ response)
}
}
}
一般项目中,还是使用Axios吧,比较方便。
js 原生手写AJAX的更多相关文章
- 原生js写Ajax
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.挺对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
- 不借助jquery封装好的ajax,你能用js手写ajax框架吗
不借助jquery封装好的ajax,你能手写ajax框架吗?最基础的ajax框架,一起来围观吧. .创建XMLHttpRequest对象 var xhr = new XMLHttpRequest(); ...
- 利用js制作异步验证ajax方法()
如何利用js写ajax异步验证.代码如下: window.onload = function(){ var name = document.getElementById('register-name- ...
- 用原生JavaScript写AJAX
//原生js写ajax就像打电话 //打电话分下面4步//1.拿出手机//2.拨号//3.说话//4.听对方说话 //ajax也分下面4步//1.创建ajax对象//2.连接到服务器//3.发送请求( ...
- 使用PHP写ajax接口
使用PHP写ajax接口 之前有学过php都是前后端没有分离的,所以也想去了解后端是怎么写出ajax接口的,可能问了别人或者上网找了很多资料都很有有点懵,或者说直接用TP或者lavarel这些后端框架 ...
- 2019前端面试系列——JS高频手写代码题
实现 new 方法 /* * 1.创建一个空对象 * 2.链接到原型 * 3.绑定this值 * 4.返回新对象 */ // 第一种实现 function createNew() { let obj ...
- js和jQuery以及ajax的小练习
今天学习了通过鼠标的点击事件然后让边框变颜色,还有怎么设置一个点击浏览器的输入框然后显示一个边框,还学习了通过ajak来获取post和get的值,通过它如何调用这个函数. 第一部分: 通过鼠标的点击让 ...
- js、jQuery、ajax面试题
1.javascript的typeof返回哪些数据类型. 答案:string,boolean,number,undefined,function,object 2.例举3种强制类型转换和2种隐式类型转 ...
- .net学习之Session、Cookie、手写Ajax代码以及请求流程
1.IIS 7 以上版本集成了两种模式,一种是经典模式,一种是集成模式(直接将asp.net框架集成到IIS中) 2.浏览器和服务器端通过什么技术来实现的?Socket(套接字),通信的语法是HTTP ...
随机推荐
- Spring autowire自动装配 ByType和ByName
不使用自动装配前使用的是类的引用: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns=& ...
- 给大家一些改善 Python 程序的 91 个建议
读了一本还不错的书「编写高质量代码改善 Python 程序的 91 个建议」,大多数的建议是真心不错,我虽然写python也有3年多了,但是有些地方确实没去注意过,特地整理了一下,给大家参考. 我已经 ...
- python高级-异常(13)
一.异常介绍 print("1---------------------") open("123.txt","r") print(" ...
- LSTMs和递归神经网络的初学者指南
本文是读A Beginner's Guide to LSTMs and Recurrent Neural Networks的个人摘要. 递归网络 Recurrent nets 递归网络是一种人工神经网 ...
- Spring boot集成spring-boot-starter-data-jpa环境搭建
1.创建Spring boot项目 2.保存等待构建完成 3.增加spring-boot-starter-data-jpa.内存数据库依赖包hsqldb <!-- 添加data jpa依赖 -- ...
- salesforce lightning零基础学习(十二) 自定义Lookup组件的实现
本篇参考:http://sfdcmonkey.com/2017/01/07/custom-lookup-lightning-component/,在参考的demo中进行了简单的改动和优化. 我们在ht ...
- 关于EF的三种分类----CodeFirst
新建StudentInfo.cs using System; using System.Collections.Generic; using System.ComponentModel.DataAnn ...
- leetcode — longest-valid-parentheses
import java.util.Stack; /** * Source : https://oj.leetcode.com/problems/longest-valid-parentheses/ * ...
- python练习一—文本转化渲染为html
想学习python已经很久了,以前使用ArcGIS的时候学习过一些简单的python语法,用来进行一些简单的GIS数据处理,但是后来并没有用到工作中也就荒废了,后来断断续续看过一些,最近想学习一门新的 ...
- 【原创】单片系统SoC
人们根据需要把一些功能模块(蓝牙.GPRS.TCP/IP通信模块等等)与MCU进行有机的结合,制造出集成度更高的系统级的芯片. SoC是System on Chip的缩写,直译是“芯片级系统” ...