ajax (一)

什么是 AJAX [ˈeɪdʒæks] ?

概念:AJAX是浏览器与服务器进行 数据通信 的技术,动态数据交互
怎么用AJAX?
1. 先使用 axios [æk‘sio ʊ s] 库, 与服务器进行 数据通信
基于 XMLHttpRequest 封装、代码简单、月下载量在 14 亿次
Vue、React 项目中都会用到 axios
2. 再学习 XMLHttpRequest 对象的使用,了解 AJAX 底层原理

axios 使用

语法:
1. 引入 axios.js: https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js
2. 使用 axios 函数
传入 配置对象
再用 .then 回调函数接收结果,并做后续处理
axious({url:'目标资源地址'
}).then(result => {//对服务器返回的数据做后续处理
})
<body><!-- axios库地址: http://cdn.jsdelivr.net/npm/axios/dist/axios.min.js 省份数据地址:http://hmajax.itheima.net/api/province目标:使用axios库,获取省份表数据,展示到页面--><!-- 1.引用axios库 --><p class="my-p"></p><script src="http://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script><script>// 2.使用axios函数axios({//去哪个地址url: 'http://hmajax.itheima.net/api/province'}).then(result => {//这里的result 为形参// console.log(result.data.list.join('<br>'))  document.querySelector('.my-p').innerHTML = result.data.list.join('<br>')})</script>
</body>

认识 URL

目标:知道作用和组成,方便与后端人员沟通
概念:URL 就是 统一资源定位符 ,简称 网址 ,用于访问网络上的 资源
组成:协议:// 域名 / 资源路径

协议
http 协议:超文本传输协议,规定浏览器和服务器之间传输数据的 格式

域名
域名:标记服务器在互联网中 方位
资源路径
资源路径:标记资源在服务器下的 具体位置

URL 查询参数

定义:浏览器提供给服务器的额外信息,让服务器返回浏览器想要的数据

语法:http://xxxx.com/xxx/xxx ? 参数名1=值1 & 参数名2=值2

axios-查询参数

语法:使用 axios 提供的 params 选项
注意:axios 在运行时把参数名和值,会拼接到 url ?参数名=值
城市列表: http://hmajax.itheima.net/api/city?pname=河北省
axios({url:'目标资源地址',params:{参数名:值
}
}).then(result => {//对服务器返回的数据做后续处理
})
axios({url:'http://hmajax.itheima.net/api/city',params:{pname:'河北省'
}
}).then(result => {//对服务器返回的数据做后续处理
})

总结:

URL 查询参数有什么作用?
浏览器提供给服务器 额外信息 ,获取对应的数据
2. axios 要如何携带查询参数?
使用 params 选项,携带参数名和值

常用请求方法和数据提交

HTTP协议-报文

接口文档

form-serialize 插件

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

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

相关文章

k8s rainbond centos7/win10 -20241124

参考 https://www.rainbond.com/ 国内一站式云原生平台 对centos7环境支持不太行 [lighthouseVM-16-5-centos ~]$ curl -o install.sh https://get.rainbond.com && bash ./install.sh 2024-11-24 09:56:57 ERROR: Ops! Docker daemon is not running. Start docke…

使用 Maven 开发 IntelliJ IDEA 插件

使用 Maven 开发 IntelliJ IDEA 插件的完整流程 1. 创建 Maven 项目 1.1 使用 IntelliJ 创建 Maven 项目 打开 IntelliJ IDEA&#xff0c;点击 File > New > Project。选择 Maven&#xff0c;填写项目名称和 GroupId&#xff0c;例如&#xff1a; GroupId: com.exampl…

Load-Balanced-Online-OJ(负载均衡式在线OJ)

负载均衡式在线OJ 前言1. 项目介绍2. 所用技术与环境所用技术栈开发环境 3. 项目宏观结构3.1 项目核心模块3.2 项目的宏观结构 4. comm公共模块4.1 日志&#xff08;log.hpp &#xff09;4.1.1 日志主要内容4.1.2 日志使用方式4.1.2 日志代码 4.2 工具&#xff08;util.hpp&…

微信小程序上传微信官方审核流程(1)

1&#xff0c;打开微信开发者工具 2&#xff0c;微信开发者工具右上角有一个上传按钮&#xff0c;点击上传按钮 3&#xff0c;点击完上传按钮会弹出一个上传成功的提示&#xff0c;点击提示框中的确定按钮 4&#xff0c;点击完确定按钮后会显示填写版本好和项目备注 5&#x…

EXISTS 和 IN 的使用方法、特性及查询效率比较

在 SQL Server 中&#xff0c;EXISTS 和 IN 是两个常用的子查询操作符&#xff0c;用于检查某个值是否存在于一个子查询的结果集中。尽管它们在功能上有相似之处&#xff0c;但在使用方法、特性、查询效率和生成查询计划方面存在一些重要的区别。本文将详细探讨这两个操作符的使…

flink学习(3)——方法的使用—对流的处理(map,flatMap,filter)

map 数据 86.149.9.216 10001 17/05/2015:10:05:30 GET /presentations/logstash-monitorama-2013/images/github-contributions.png 83.149.9.216 10002 17/05/2015:10:06:53 GET /presentations/logstash-monitorama-2013/css/print/paper.css 83.149.9.216 10002 17/05/20…

数据结构(Java版)第一期:时间复杂度和空间复杂度

目录 一、数据结构的概念 1.1. 什么是数据结构 1.2. 算法与数据结构的关系 二、算法效率 三、时间复杂度 3.1. 大O的渐进表⽰法 3.2. 计算冒泡排序的时间复杂度 3.3. 计算二分查找的时间复杂度 四、空间复杂度 4.1. 空间复杂度 4.2. 冒泡排序的空间复杂度 4.3.…

微信小程序全局配置:导航栏、下拉刷新与上拉触底设置教程

微信小程序全局配置:导航栏、下拉刷新与上拉触底设置教程 引言 微信小程序作为一种新兴的轻量级应用,凭借其便捷性和丰富的功能受到了广泛的欢迎。在开发小程序的过程中,合理配置全局属性是提升用户体验的关键。本文将深入探讨小程序的全局配置中的window选项,重点介绍导…

语言模型中的多模态链式推理

神经网络的公式推导 简介摘要引言多模态思维链推理的挑战多模态CoT框架多模态CoT模型架构细节编码模块融合模块解码模块 实验结果运行代码补充细节安装包下载Flan-T5数据集准备rougenltkall-MiniLM-L6-v2运行 简介 本文主要对2023一篇论文《Multimodal Chain-of-Thought Reason…

LLaMA-Mesh: Unifying 3D Mesh Generation with Language Models 论文解读

目录 一、概述 二、相关工作 1、LLMs到多模态 2、3D对象生成 3、自回归的Mesh生成 三、LLaMA-Mesh 1、3D表示 2、预训练模型 3、有监督的微调数据集 4、数据集演示 四、实验 1、生成的多样性 2、不同模型text-to-Mesh的比较 3、通用语境的评估 一、概述 该论文首…

【Go】-go中的锁机制

目录 一、锁的基础知识 1. 互斥量/互斥锁 2. CAS&#xff08;compare and swap&#xff09; 3. 自旋锁 4. 读写锁 5. 乐观锁 & 悲观锁 6. 死锁 二、go中锁机制 1. Mutex-互斥锁 2. RWMutex-读写锁 2.1 RWMutex流程概览 2.2 写锁饥饿问题 2.3. golang的读写锁源…

VSCode 新建 Python 包/模块 Pylance 无法解析

问题描述&#xff1a; 利用 VSCode 写代码&#xff0c;在项目里新建一个 Python 包或者模块&#xff0c;然后在其他文件里正常导入这个包或者模块时出现&#xff1a; Import “xxxx” could not be resolved Pylance (reportMissingImports) 也就是说 Pylance 此时无法解析我们…

深入理解 Java 阻塞队列:使用场景、原理与性能优化

在并发编程中&#xff0c;线程安全的队列是解决线程间任务传递和调度的关键工具之一。阻塞队列&#xff08;BlockingQueue&#xff09;作为一种线程安全的队列&#xff0c;实现了在并发环境下对共享数据的安全访问&#xff0c;广泛应用于生产者-消费者模型、任务调度和多线程计…

.NET9 - 新功能体验(二)

书接上回&#xff0c;我们继续来聊聊.NET9和C#13带来的新变化。 01、新的泛型约束 allows ref struct 这是在 C# 13 中&#xff0c;引入的一项新的泛型约束功能&#xff0c;允许对泛型类型参数应用 ref struct 约束。 可能这样说不够直观&#xff0c;简单来说就是Span、ReadO…

C++游戏《密室逃脱2.0》预告

这里是2.0预告区域&#xff0c;发布时将直接以此文章界面发布&#xff0c;可以提前点赞收藏。 你们所期待的2.0就要来啦&#xff01; 是的&#xff0c;没错&#xff0c;今年年末就要出2.0版本了&#xff0c;时间大约在12月底。玩法有更新&#xff0c;更新如下&#xff1a; 增…

抗癌药物“曲妥珠单抗”,或将纳入2025版《中国药典》!

在抗癌药物的浩瀚星空中&#xff0c;曲妥珠单抗如同一颗璀璨的星辰&#xff0c;以其卓越的治疗效果和广泛的应用前景&#xff0c;照亮了无数HER2阳性癌症患者的生命之路。近日&#xff0c;从国家药典委员会传来振奋人心的消息——注射用曲妥珠单抗正式进入《中国药典》2025版国…

JavaParser 的全面介绍

JavaParser 是什么&#xff1f; JavaParser 的快速介绍可以参考&#xff1a; # JavaParser的快速介绍 JavaParser是一个用于解析Java源码的开源工具&#xff0c;它提供了一种简单而有效的方式来解析和操作Java代码。JavaParser解析源码的方式主要基于其将Java代码转换为抽象语…

图形化界面MySQL(MySQL)(超级详细)

1.官网地址 MySQL :: Download MySQL Workbench 1.1在Linux直接点击NO thanks..... 下载完后是这个页面 1.2任何远端登录&#xff0c;再把jj数据库给授权 1.3建立新用户 进行连接 点击这个就运行了 只执行show tables&#xff1b;要先选中 圆圈处支持自己输入 点击这个就执…

【夹板涨停战法】技术形态,原理和操盘技术图文教程

夹板涨停战法的基本形态和原理 夹板涨停是指两股强大的做多力量以夹击的方式紧紧的封夹空头&#xff0c;把空头力量打趴下&#xff0c;让空头的做空希望被破灭。 两股强大的多头力量对付空头&#xff0c;多头战胜&#xff0c;轻易灭掉空头&#xff0c;一切在强大做多力量的把…

C#里怎么样使用LINQ的let关键字实现查询?

C#里怎么样使用LINQ的let关键字实现查询? 在C#中,let关键字是用来在查询表达式中声明一个范围变量的。范围变量是在迭代过程中保存查询产生的序列中的元素的临时变量。 以下是一个使用let关键字的示例代码: /** C# Program to Implement Let Condition using LINQ*/ usi…