Ajax和axios基础

AJAX

Asynchronous JavaScript And XML

异步的JavaScript和XML

请添加图片描述

作用

数据交换:

通过Ajax可以给服务器发送请求,服务器将数据直接响应回给浏览器.

异步交互:

可以在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页的技术.

同步和异步

同步发送请求:

请添加图片描述

浏览器发送请求给服务器,服务器处理请求的过程中,页面不能做其他操作,直到服务器响应结束.

异步发送请求:

请添加图片描述

浏览器页面发送请求给服务器,在服务器处理请求的过程中,还可以做其他的操作.

原生异步请求代码
1,创建XMLHttpRequest
var xmlHttpRequest = new XMLHttpRequest();
2,发送异步请求
xmlHttpRequest.open('Get','url');
xmlHttpRequest.send();
3,获取服务响应数据
xmlHttpRequest.onreadystatechange = function(){}

Axios

AJAX框架,对原生AJAX进行了封装

1,引入axios文件
<script src="axios文件路径">
2,发起axios请求
//axios的get请求
axios({method:"get",url:""
}).then((result)) => {console.log(result.data);
}
//axios的post请求
axios({method:"post",url:""data:"键=值"
}).then((result)) => {console.log(result.data);
}

method属性:设置请求方式

url属性:书写请求的资源路径,get请求需要把参数拼在url之后

data属性:post请求时作为请求体发送数据

then()传递一个匿名函数,在成功响应后调用,回复的result代表对响应数据封装的对象,通过result.data可以获取实际数据

axios的简化
get
axios.get("url").then((result) => {console.log(result.data);
});
post
axios.post("url","键=值").then((result) => {console.log(result.data);
});

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/828226.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Linux中Ctrl+C和Ctrl+Z的区别_实战讲解(超详细)

1、CtrlC和CtrlZ的区别&#xff1a; CtrlZ&#xff1a;暂停进程 即挂起进程 暂停当前进程并将其放到后台。可以在后续恢复执行。 暂停的进程仍然占用系统内存 CtrlC&#xff1a;终止进程 终止进程后&#xff0c;程序代码占用的内存会释放掉 2、实战讲解 跑人工智能代码的时候…

redis故障中出现的缓存击穿、缓存穿透、缓存雪崩?

一、背景&#xff1a; 在维护redis服务过程中&#xff0c;经常遇见一些redis的名词&#xff0c;例如缓存击穿、缓存穿透、缓存雪崩等&#xff0c;但是不是很理解这些&#xff0c;如下就来解析一下缓存击穿、缓存穿透、缓存雪崩名词。 二、缓存穿透问题&#xff1a; 常见的缓存使…

flutter ios Firebase 消息通知错误 I-COR000005,I-FCM001000 解决

*前提是已经 使用firebase-tools 已经给 Flutter 加入了 消息通知相关配置。教程>> 一、I-COR000005 10.22.0 - [FirebaseCore][I-COR000005] No app has been configured yet. import Firebase....FirebaseApp.configure() 10.22.0 - [FirebaseMessaging][I-FCM001000…

mysql事故复盘: 单行字节最大阈值65535字节(原创)

背景 记得还在银行做开发&#xff0c;投产上线时&#xff0c;项目发版前&#xff0c;要提DDL的sql工单&#xff0c;mysql加1个字段&#xff0c;因为这张表为下游数据入湖入仓用的&#xff0c;长度较大。在测试库加字段没问题&#xff0c;但生产库字段加不上。 先说结论 投产…

QT初识

通过图形化界面输出helloworld 既然学习了QT&#xff0c;那么自然要做经典的输出helloworld字符串的实验。 QT有两好几种方案输出helloworld&#xff0c;一种是通过图形化界面输出&#xff0c;一种是通过代码实现。 这里先了解图形化界面的方案。 创建项目后&#xff0c;点…

LeetCode:2385. 感染二叉树需要的总时间(DFS Java)

目录 2385. 感染二叉树需要的总时间 题目描述&#xff1a; 实现代码与解析&#xff1a; DFS 原理思路&#xff1a; 2385. 感染二叉树需要的总时间 题目描述&#xff1a; 给你一棵二叉树的根节点 root &#xff0c;二叉树中节点的值 互不相同 。另给你一个整数 start 。在第…

【论文阅读】互连网络的负载平衡路由算法 (RLB RLBth)

前言Oblivious Load Balancing 不经意路由负载平衡 1. oblivious routing 不经意/无关路由的背景知识 1. oblivious routing, adaptive routing & minimal/non-minimal routing algorithms 2. Balancing a 1-Dimensional ring: RLB and RLBth 一维 ring 的 RLB and RLBth 1…

如何设计一个安全的系统架构?

本文转自 公众号 ByteByteGo&#xff0c;如有侵权&#xff0c;请联系&#xff0c;立即删除 如何设计一个安全的系统架构&#xff1f; 如何设计安全的系统&#xff1f;我们总结了 12 条原则供架构师们参考。 设计安全的系统非常重要&#xff0c;原因有很多&#xff0c;从保护敏…

SpringCloud系列(13)--Eureka服务名称修改和服务IP显示

前言&#xff1a;在上一章节中我们把服务提供者做成了集群&#xff0c;而本章节则是一些关于服务信息的配置&#xff0c;这部分知识对集群整体影响不大&#xff0c;不过最好还是掌握&#xff0c;毕竟万一有用到的地方呢 1、修改服务的名称 有时候我们想要修改服务的名称&#…

JavaSE学习文档(上)

JavaSE学习文档 第一章 Java概述1.2 计算机编程语言1.3 Java语言版本概述1.4 Java语言分类1.5 JDK,JRE,JVM的关系1.6 JDK安装1.7 DOS命令1.8 Java程序执行过程1.9 编写HelloWorld1.10 常见错误1.11 编写程序时要注意的点 第二章 Java基础语法2.1 Java中的注释文档注释 2.2 关键…

武汉星起航:亚马逊全球资源赋能中国卖家,跨境电商助力品牌国际化

亚马逊全球开店业务于2015年正式进驻中国&#xff0c;为中国卖家打开了通往全球市场的便捷之门。这一举措不仅为中国卖家提供了与全球消费者直接交流的机会&#xff0c;更借助亚马逊的丰富资源和先进技术&#xff0c;帮助卖家将优质的中国商品推向世界舞台。亚马逊平台以其高效…

Ant Design Vue + js 表格计算合计

1.需要计算的数量固定&#xff08;如表1&#xff0c;已知需要计算的金额为&#xff1a;装修履约保证金 装修垃圾清运费出入证工本费 出入证押金 这四项相加&#xff0c;可以写成固定的算法&#xff09;&#xff1a; 表格样式&#xff1a; <h4 style"margin: 0 0 8px…

Bayes判别示例数据:鸢尾花数据集

使用Bayes判别的R语言实例通常涉及使用朴素贝叶斯分类器。朴素贝叶斯分类器是一种简单的概率分类器&#xff0c;基于贝叶斯定理和特征之间的独立性假设。在R中&#xff0c;我们可以使用e1071包中的naiveBayes函数来实现这一算法。下面&#xff0c;我将通过一个简单的示例展示如…

《生成式AI导论》学习笔记

1.课程定位 2.什么是生成式人工智慧&#xff1f; 3. 今日的生成式人工智慧厉害在哪里&#xff1f; 4.训练不了人工智慧&#xff1f;那我训练自己 5.训练不了人工智慧&#xff1f;你可以训练你自己&#xff08;中&#xff09;——拆解问题使用工具 6.大语言模型修炼史——第一阶…

微信小程序使用echarts组件实现饼状统计图功能

微信小程序使用echarts组件实现饼状统计图功能 使用echarts实现在微信小程序中统计图的功能&#xff0c;具体的实现步骤思路可进我主页查看我的另一篇博文https://blog.csdn.net/weixin_45465881/article/details/138171153进行查看&#xff0c;本篇文章主要使用echarts组件实…

Redis(六) Set集合类型

文章目录 前言命令SADDSMEMBERSSISMEMBERSCARDSPOPSMOVESREM集合间操作SINTERSINTERSTORESUNIONSUNIONSTORESDIFFSDIFFSTORE 命令小结 内部编码使用场景 前言 集合类型也是保存多个字符串类型的元素的&#xff0c;和列表类型不同的是&#xff0c;set集合类型中的元素是无序的且…

java 抽象类(abstract)

1 由abstract修饰的类叫做抽象类 也可以修饰抽象方法 2 abstract修饰的抽象方法不可以在抽象类当中实现 但一定要在子类当中重写 并实现 public abstract class p1 { public abstract void work(); public void run() { System.out.println("run"); } } class prog…

基于springboot+vue的民法普及系统的设计与实现

1、系统演示视频&#xff08;演示视频&#xff09; 2、需要请联系

2. 多机多卡运行nccl-tests对比分析

系列文章 第2章 多机多卡nccl-tests 对比分析 目录 系列文章前言一、本地环境1. 网卡接口2. RDMA3. TOPO信息pcie信息nvidia-smi topo -m 二、nccl-test对比分析1. 相关环境变量2. 不同情况的对比3. 总结与分析 前言 NCCL&#xff08;NVIDIA Collective Communications Libra…

javaWeb项目-房屋房租租赁系统功能介绍

项目关键技术 开发工具&#xff1a;IDEA 、Eclipse 编程语言: Java 数据库: MySQL5.7 框架&#xff1a;ssm、Springboot 前端&#xff1a;Vue、ElementUI 关键技术&#xff1a;springboot、SSM、vue、MYSQL、MAVEN 数据库工具&#xff1a;Navicat、SQLyog 1、JSP技术 JSP(Jav…