Web前端-Ajax

Ajax

概念:Asynchronous JavaScript And XML,异步的JavaScript和XML。
作用:
1.数据交换:通过Ajax可以给服务器发送请求,并获取服务器响应的数据。
2.异步交互:可以在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页的技术,如:搜索联想、用户名是否可用的校验等等。就像我们的百度搜索框,我们输入关键词后会有下拉框联想出关键词,而页面并没有任何刷新,这就是异步交互。

同步请求:

我们发起请求,服务器在处理逻辑的情况下,客户端是等待状态。

异步请求:

是客户端在服务器处理逻辑的情况下还能进行其他操作。

原生Ajax:

1.创建XMLHttpRequest对象:用于和服务器交换数据

2.向服务器发送请求

3.获取服务器响应数据

Axios:Axois对Ajax进行了封装,简化书写,快速开发。

1.引入Axios的JS文件

<script src="axios.js"></script>

2.使用Axios发送请求,并获取响应结果

请求方式别名简化书写:方括号为选填

例子:

axios.post("URL","date").then(redult=>console.log(result.date));

常常在vue的monted钩子函数发送异步请求

<script>
new Vue({
el:"接管区域",
date:{},
mounted(){
axios.get("URL").then(result=>{result.date;
})
}
)};
<script>
</html>

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

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

相关文章

ARM嵌入式控制器带HDMI为制造业注入智能动力

工业自动化技术的飞速发展&#xff0c;IT与OT的融合已成为推动工业进步的关键力量。在这个背景下&#xff0c;ARM工业计算机凭借其强大的功能和灵活性&#xff0c;成为了边缘自动化领域的一颗新星。今天&#xff0c;我们将深入探讨这款设备如何通过其独特的特性&#xff0c;助力…

Scrapy 爬取m3u8视频

Scrapy 爬取m3u8视频 【一】效果展示 爬取ts文件样式 合成的MP4文件 【二】分析m3u8文件路径 视频地址&#xff1a;[在线播放我独自升级 第03集 - 高清资源](https://www.physkan.com/ph/175552-8-3.html) 【1】找到m3u8文件 这里任务目标很明确 就是找m3u8文件 打开浏览器…

【C语言】“vid”Microsoft Visual Studio安装及应用(检验内存泄露)

文章目录 前言安装包获取配置VLD完成 前言 我们在写代码时往往容易存在内存泄漏的情况&#xff0c;所以存在这样一个名为VLD的工具用来检验内存泄漏&#xff0c;现在我来教大家安装一下 安装包获取 vld下载网址&#xff1a;https://github.com/KindDragon/vld/releases/tag/…

三支冲突分析介绍

Pawlak最早通过观察一组智能体对一组问题的意见&#xff0c;提出了冲突分析模型。U表示对象集&#xff0c;V表示属性集&#xff0c;R表示对象集和属性集之间的二元关系&#xff0c;这样一个刻画冲突分析的信息系统通过三元组&#xff08;U&#xff0c;V&#xff0c;R&#xff0…

物理服务器与云服务器的租用对比

​ 物理服务器&#xff1a;每个基于 Web 的应用程序都依赖于一个服务器&#xff0c;该服务器提供网络中的数据存储&#xff0c;并可根据请求提供给客户端。例如&#xff0c;用户使用浏览器访问 Web 应用程序。服务器可确保托管客户端可以使用该硬件组件。与其他托管可能性相比&…

LeetCode 2529. 正整数和负整数的最大计数——每日一题

上一篇博客&#xff1a;LeetCode 993. 二叉树的堂兄弟节点——每日一题 写在前面&#xff1a;大家好&#xff01;我是晴空๓。如果博客中有不足或者的错误的地方欢迎在评论区或者私信我指正&#xff0c;感谢大家的不吝赐教。我的唯一博客更新地址是&#xff1a;https://ac-fun.…

【黑马头条】-day07APP端文章搜索-ES-mongoDB

文章目录 今日内容1 搭建es环境1.1 拉取es镜像1.2 创建容器1.3 配置中文分词器ik1.4 测试 2 app文章搜索2.1 需求说明2.2 思路分析2.3 创建索引和映射2.3.1 PUT请求添加映射2.3.2 其他操作 2.4 初始化索引库数据2.4.1 导入es-init2.4.2 es-init配置2.4.3 导入数据2.4.4 查询已导…

Elastisearch、Kibana安装

Elastisearch简介 全文搜索属于最常见的需求&#xff0c;开源的 Elasticsearch &#xff08;以下简称 Elastic&#xff09;是目前全文搜索引擎的首选。它可以快速地储存、搜索和分析海量数据。 Elastic 的底层是开源库 Lucene。但是&#xff0c;你没法直接用 Lucene&#xff0…

[网鼎杯 2020 玄武组]SSRFMe

[网鼎杯 2020 玄武组]SSRFMe 源码 <?php function check_inner_ip($url) {$match_resultpreg_match(/^(http|https|gopher|dict)?:\/\/.*(\/)?.*$/,$url);if (!$match_result){die(url fomat error);}try{$url_parseparse_url($url);}catch(Exception $e){die(url foma…

真实世界的映照-DDD实体

什么是实体&#xff1f; 实体&#xff0c;官方的解释是&#xff1a;实体&#xff08;Entity&#xff0c;又称为Reference Object&#xff09;很多对象不是通过他们的属性定义的&#xff0c;而是通过一连串的连续事件和标识定义的。主要由标识定义的对象被称为ENTITY。 但&…

RTThread studio 驱动开发

rtthread 驱动使用的两种情况 rtthread studio 自动生成 由 RT Thread Studio 自动生成&#xff0c;无需修改任何文件或者简单定义几个宏即可直接使用的驱动&#xff0c;如 GPIO&#xff0c;UART&#xff0c;I2C&#xff0c;SPI&#xff0c;SDIO 和 ETH 等。 使用 RT-Thread S…

嵌入式硬件中常见的面试问题与实现

1 01 请列举您知道的电阻、电容、电感品牌(最好包括国内、国外品牌) ▶电阻 美国:AVX、VISHAY威世 日本:KOA兴亚、Kyocera京瓷、muRata村田、Panasonic松下、ROHM罗姆、susumu、TDK 台湾:LIZ丽智、PHYCOM飞元、RALEC旺诠、ROYALOHM厚生、SUPEROHM美隆、TA-I大毅、TMT…

STM32学习和实践笔记(6):自己进行时钟配置的思路

在《STM32学习和实践笔记&#xff08;4&#xff09;: 分析和理解GPIO_InitTypeDef GPIO_InitStructure (d)-CSDN博客》 中&#xff0c;我了解到&#xff0c;在程序执行我们写的main函数之前&#xff0c;实际上先执行了一个汇编语言所写的启动文件&#xff0c;以完成相应的初始…

TCP协议简单总结

TCP&#xff1a;传输控制协议 特点&#xff1a;面向连接、可靠通信 TCP的最终目的&#xff1a;要保证在不可靠的信道上实现可靠的传输 TCP主要有三个步骤实现可靠传输&#xff1a;三次握手建立连接&#xff0c;传输数据进行确认&#xff0c;四次挥手断开连接 三次握手建立可靠…

【刷题篇】回溯算法(二)

文章目录 1、求根节点到叶节点数字之和2、二叉树剪枝3、验证二叉搜索树4、二叉搜索树中第K小的元素5、二叉树的所有路径 1、求根节点到叶节点数字之和 给你一个二叉树的根节点 root &#xff0c;树中每个节点都存放有一个 0 到 9 之间的数字。 每条从根节点到叶节点的路径都代表…

网络安全---Packet Tracer - 配置扩展 ACL

一、实验目的 在Windows环境下利用Cisco Packet Tracer进行 配置防火墙操作。 二、实验环境 1.Windows10、Cisco Packet Tracer 8.2 2.相关的环境设置 在最初的时候&#xff0c;我们已经得到了搭建好的拓扑模型&#xff0c;利用已经搭建好的拓扑模型&#xff0c;进行后续的…

【AAOS车载系统+AOSP14系统攻城狮入门实战课】:正式上线了(二百零三)

简介&#xff1a; CSDN博客专家&#xff0c;专注Android/Linux系统&#xff0c;分享多mic语音方案、音视频、编解码等技术&#xff0c;与大家一起成长&#xff01; 优质专栏&#xff1a;Audio工程师进阶系列【原创干货持续更新中……】&#x1f680; 优质专栏&#xff1a;多媒…

B02、分析GC日志-6.3

1、相关GC日志参数 -verbose:gc 输出gc日志信息&#xff0c;默认输出到标准输出-XX:PrintGC 输出GC日志。类似&#xff1a;-verbose:gc-XX:PrintGCDetails 在发生垃圾回收时打印内存回收详细的日志&#xff0c; 并在进程退出时输出当前内存各区域分配情况-XX:PrintGCTimeStamp…

K8S容器空间不足问题分析和解决

如上图&#xff0c;今天测试环境的K8S平台出现了一个问题&#xff0c;其中的一个容器报错&#xff1a;Free disk space below threshold. Available: 3223552 bytes (threshold: 10485760B)&#xff0c;意思服务器硬盘空间不够了。这个问题怎么产生的&#xff0c;又怎么解决的呢…

springboot+vue2+elementui+mybatis- 批量导出导入

全部导出 批量导出 报错问题分析 经过排查&#xff0c;原因是因为在发起 axios 请求的时候&#xff0c;没有指定响应的数据类型&#xff08;这里需要指定响应的数据类型为 blob 二进制文件&#xff09; 当响应数据回来后&#xff0c;会执行 axios 后置拦截器的代码&#xff0…