前端面试题整理——手写AJAX
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>手写ajax</title>
</head>
<body>
<script>
const xhr = new XMLHttpRequest();
xhr.open('GET', '/api', false);
xhr.onreadystatechange = function () {
// xhr.readyState 的各个状态
// 0：未初始化，还没有调用send()方法
// 1：载入，已调用send()方法，正在发送请求
// 2：载入完成，send()方法执行完成，已经接收到全部响应内容
// 3：交互，正在解析响应内容
// 4：完成，响应内容解析完成，可以再客户端调用
if(xhr.readyState == 4){
// status状态码分类：
// 1xx：服务器收到请求
// 2xx：请求成功
// 3xx：重定向
// 4xx：客户端错误
// 5xx：服务端错误
if(xhr.status == 200){
// 常见状态：
// 200：成功
// 301：永久重定向
// 302：临时重定向
// 304：资源未被修改
// 404：资源未找到
// 403：没有权限
// 500：服务器错误
// 504：网关超时
alert(xhr.responseText)
}
}
}
xhr.send(null) xhr.open('POST','/api',false)
const postData={
userName:'zhangsan',
password:'abc123'
}
xhr.send(JSON.stringify(postData)) </script>
</body>
</html>
考点：
1、XMLHttpRequest的使用
2、XMLHttpRequest状态码
3、常见请求状态码
前端面试题整理——手写AJAX的更多相关文章
- 前端面试题整理——手写方法解析URL参数
//拆分字符串形式 function queryToObj() { const res = {} const search = location.search.substr(1);//去掉前面的&qu ...
- 前端面试题整理——手写简易jquery
class jQuery { constructor(selector) { const result = document.querySelectorAll(selector) console.lo ...
- 前端面试题整理——手写bind函数
var arr = [1,2,3,4,5] console.log(arr.slice(1,4)) console.log(arr) Function.prototype.bind1 = functi ...
- 前端面试题整理——手写flatern摊平数组
// flatern 是摊平数组 function flat(arr) { const isDeep = arr.some(item => item instanceof Array) if(! ...
- 前端面试题之手写promise
前端面试题之Promise问题 前言 在我们日常开发中会遇到很多异步的情况,比如涉及到 网络请求(ajax,axios等),定时器这些,对于这些异步操作我们如果需要拿到他们操作后的结果,就需要使用到回 ...
- 【web前端面试题整理02】前端面试题第二弹袭来，接招！
前言 今天本来准备先了解下node.js的,但是,看看我们一个小时前与一个小时后的差距: 既然如此,我们继续来搜集我们的前端面试题大业吧!!! 特别感谢玉面小肥鱼提供哟,@玉面小飞鱼 题目一览 Jav ...
- 【web前端面试题整理06】成都第一弹，邂逅聚美优品
前言 上周四回了成都,休息了一下下,工作问题还是需要解决的,于是今天去面试了一下,现在面试回来了,我感觉还是可以整理一下心得. 这个面试题整理系列是为了以后前端方面的兄弟面试时候可以得到一点点帮助,因 ...
- 前端面试题整理—JavaScript篇（一）
1.JS的基本数据类型和引用数据类型有哪些,两者区别 基本数据类型->string.number.Boolean.null.undefined.symbol 引用数据类型->array.o ...
- 前端面试题整理—JavaScript篇（二）
1.使用js实现一个可持续的动画 2.实现一个可以自由拖动的悬浮框 3.实现一个倒计时效果 4.使用js仿写一个原生下拉列表框 5.创建10个<a>标签,点击的时候弹出对应的序号 6.实现 ...
随机推荐
- JZ-013-调整数组顺序使奇数位于偶数前面
调整数组顺序使奇数位于偶数前面 题目描述 输入一个整数数组,实现一个函数来调整该数组中数字的顺序,使得所有的奇数位于数组的前半部分,所有的偶数位于数组的后半部分,并保证奇数和奇数,偶数和偶数之间的相对 ...
- css蒙层
{ -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); ...
- Spring源码之九finishRefresh详解
Spring源码之九finishRefresh详解 公众号搜索[程序员田同学],专职程序员兼业余写手,生活不止于写代码 Spring IoC 的核心内容要收尾了,本文将对最后一个方法 finishRe ...
- 构造方法__construct()与析构方法__destruct() 构造方法：刚出生时婴儿的啼哭 析构方法：老人临终时的遗言
<?phpclass person{ var $name; var $sex; var $age;//构造方法 function __construct($name, $sex, $age) { ...
- thinkpad笔记本选型
ThinkPad分为了几大系列,低端的有L系列.E系列,比较高端的有T系列.X系列及P系列,这些系列中质量比较稳定属于商务办公系列,中端有针对商务或者是娱乐的R系列.A系列和S系列.具体介绍如下: 1 ...
- Windows 下 MySQL 简单定时自动备份、删除过期备份
Windows 下 MySQL 简单定时自动备份.删除过期备份 MySQL Workbench 客户端虽然好用,但并不提供自动备份功能.手工备份,确实繁琐. 新建一个 数据库备份文件存放目录,本例为D ...
- Bellman-Ford算法 求有边数限制的最短路
这个算法也是紧承我们之前讲过的关于图论的内容,我们在前面分析图的时候说过了对于不同的图论问题,我们会有不同的求解方法,那么这里我们讲到Bellman-Ford算法是用于解决有边数限制的求解最短路问题. ...
- vue学习过程总结（04） - 菜鸟教程归纳
1.组件 组件(component)是vue.js最强大的功能之一.组件可以扩展html元素,封装可重用的代码.组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的界面都可以抽象 ...
- ms17-010-永恒之蓝漏洞利用教程
实验环境:虚拟机:kali-linux windows 7 请自行下载安装 1.打开虚拟机 启动kali-linux 启动windows7(未装补丁) 2.获取IP地址(ifconfig ipconf ...
- [转载]nc命令详解
最近在搞反向连接,试来试去发现最好的工具还是nc.正好趁这个机会把nc的用法总结一下: 1.端口扫描: nc -vv ip port 例:nc -vv 192.168.1.1 5000 扫描192.1 ...