当前位置: 首页 > news >正文

AJAX学习笔记1发送Get请求

传统请求有哪些方式,及缺点

传统请求有哪些?

1.直接在浏览器地址栏上输入URL.

2.点击超连接.

<a href="/上下文/请求地址">超链接请求</a>  ---->相对路径

<a href="http://www.baidu.com">超链接请求</a>  ---->绝对路径

3.提交form表单

<form action="/上下文/请求地址" method="post">

4.使用JS代码

window.open("url")

document.localtion.href=""

window.localtion.href=""

新建项目举例

next----next

设置字符集

添加框架支持

关于为什么项目启动会自动访问index的说明

Servlet中WebApp欢迎页面配置_biubiubiu0706的博客-CSDN博客

 引入依赖

index.html

 

配置Tomcat

传统请求的缺点,每次请求都会将整个页面刷新

AJAX可以做到局部刷新

AJAX通过浏览器上一个对象XMLHttpRequest  可以理解为一个线程,

通过XMLHttpRequest(浏览器内置对象)向服务器发送请求做到局部更新

AJAX可以在浏览器当中发送异步请求.请求A和请求B是异步的.谁也不需要等谁.类似多线程并发

响应回来的数据:普通文本,XML字符串,JSON数据

学习AJAX需要看得懂下面JS代码

发送第一个AJAX请求

AJAX   GET请求

添加依赖

配置Tomcat

测试

因为后端没有写该接口

最核心部分就是框中的回调函数中的

再次测试

编写后端代码

测试

后端出错

测试

后端向浏览器响应文本数据

其实该用responseText

测试   完美

其实该用responseText

测试

给点颜色看看

其实该用responseText

测试

再做个练习  熟练发送AJAX   GET请求

 

下面来改进一下AJAX请求的写法    下面这样也可以  不知道为什么

理论来说this已经没效果了.但是测试也可以

正确的写法应该是如下   ajax3这种方式只是为了扩展下思路

AJAX GET请求   提交数据给服务器    以ajax2为例

get请求提交数据是在请求行上

格式比如:url?name=xxx&password=xxx  是HTTP协议中规定的

测试

注意请求地址并没有变化,参数也没有再url上

看下后端有没有接收到

但是现在 参数在程序里是写死的   改一下代码

测试  输出到前端页面没有乱码

  

控制台乱码,应该是

改成了GBK试试  和自己计算机字符集原因

  • 对于低版本的IE浏览器来说,AJAX的get请求可能会走缓存。存在缓存问题。对于现代的浏览器来说,大部分浏览器都已经不存在AJAX get缓存问题了。

  • 什么是AJAX GET请求缓存问题呢?

    • 在HTTP协议中是这样规定get请求的:get请求会被缓存起来。

    • 发送AJAX GET请求时,在同一个浏览器上,前后发送的AJAX请求路径一样的话,对于低版本的IE来说,第二次的AJAX GET请求会走缓存,不走服务器。

  • POST请求在HTTP协议中规定的是:POST请求不会被浏览器缓存。

  • GET请求缓存的优缺点:

    • 优点:直接从浏览器缓存中获取资源,不需要从服务器上重新加载资源,速度较快,用户体验好。

    • 缺点:无法实时获取最新的服务器资源。

  • 浏览器什么时候会走缓存?

    • 第一:是一个GET请求

    • 第二:请求路径已经被浏览器缓存过了。第二次发送请求的时候,这个路径没有变化,会走浏览器缓存。

  • 如果是低版本的IE浏览器,怎么解决AJAX GET请求的缓存问题呢?

    • 可以在请求路径url后面添加一个时间戳,这个时间戳是随时变化的。所以每一次发送的请求路径都是不一样的,这样就不会走浏览器的缓存问题了。

    • 可以采用时间戳:"url?t=" + new Date().getTime()

    • 或者可以通过随机数:"url?t=" + Math.random()

    • 也可以随机数+时间戳....

如果真遇到了  解决方式

或者随机数加时间戳     随机数:Math.random()

相关文章:

AJAX学习笔记1发送Get请求

传统请求有哪些方式,及缺点 传统请求有哪些? 1.直接在浏览器地址栏上输入URL. 2.点击超连接. <a href"/上下文/请求地址">超链接请求</a> ---->相对路径 <a href"http://www.baidu.com">超链接请求</a> ---->绝对路…...

Elasticsearch 高级搜索技巧和最佳实践

Elasticsearch 高级搜索技巧和最佳实践 Elasticsearch 是一个开源的分布式搜索和分析引擎&#xff0c;它支持实时地存储、搜索和分析大规模数据。它被广泛应用于各行各业&#xff0c;用于构建高性能的搜索引擎、日志分析系统、电子商务推荐系统等。 本文将介…...

解决 .csv 文件上传到 pgsql 的字符报错问题

目录 背景问题解决办法 背景 上传 .csv 文件进行数据导入到 pg 时&#xff0c;报错显示如下&#xff1a; ods.tbl_inp_fee_detail.csv数据上传失败 报错信息:org.postgresql.util.PSQLException: ERROR: invalid byte sequence for encoding "UTF8": 0x00 Where: C…...

linux自动挂载并添加用户权限

目录 写在前面自动挂载完 写在前面 1、本文内容 linux挂载文件后&#xff0c;没有文件权限&#xff0c;使用uid和gid指定所需的所有者和所属组 2、平台/环境 linux 3、转载请注明出处&#xff1a; https://blog.csdn.net/qq_41102371/article/details/132539384 自动挂载 开…...

【C++】学习STL中的stack和queue

❤️前言 今天这篇博客的内容主要关于STL中的stack、queue和priority_queue三种容器。 正文 stack和queue的使用方式非常简单&#xff0c;我们只要根据之前学习数据结构的经验和文档介绍就可以轻松上手。于是我们直接开始对它们的模拟实现。 stack和queue的模拟实现 stack和q…...

Java捕获异常

在Java中&#xff0c;凡是可能抛出异常的语句&#xff0c;都可以用try ... catch捕获。把可能发生异常的语句放在try { ... }中&#xff0c;然后使用catch捕获对应的Exception及其子类。 使用try ... catch ... finally时&#xff1a; 多个catch语句的匹配顺序非常重要&#xf…...

【LLM】快速开始 LangChain

theme: orange LangChain是一个软件开发工具包&#xff0c;它通过将组件链接在一起并公开简单统一的API&#xff0c;简化了大型语言模型和应用程序的集成。本篇文章将会简要介绍&#xff0c;让各位开发者对其有一个整体的认识。 前言 如果你是一名软件开发人员&#xff0c;努力…...

Unity中立体声平移的应用

实现的效果 若从左声道开始&#xff0c;播放效果逐渐从左声道过渡到右声道&#xff0c;再从右声道过渡到左声道&#xff0c;具体效果请戴上耳机播放下列视频。 StereoPanning 代码实现 public class AudioInfo {[HideInInspector] public float[] StereoTranslationValues;//立…...

jupyter常用的方法以及快捷键

选中状态 蓝色 按enter 进入编辑状态 编辑状态 绿色 按Esc 进入选中状态 Code模式运行是运行代码 Markdown模式运行是进入预览状态 - - - 是文本格式的一种精简的语法形式 Raw NBConvert 是默认文本状态 - - - 输入什么样 展示什么样 Y - - - 切换code模式 M - - - 切换Markdo…...

SQL Server 操作JSON数据库列

Sql Server 从 2016 开始支持了一些 json 操作&#xff0c;但在SqlServer中Json还是被存储为字符串&#xff0c;如下&#xff1a; use [tempdb]declare JSON nvarchar(max) set JSONN{"id": "WakefieldFamily","parents": [{ "familyName&q…...

拼多多开放平台的API接口可以获取拼多多电商数据。以下是API接口流程

使用拼多多开放平台的API接口可以获取拼多多电商数据。以下是一般的API接口流程&#xff1a; 1. 注册开发者账号&#xff1a;首先&#xff0c;您需要在拼多多开放平台注册一个开发者账号。通过开发者账号&#xff0c;您可以获得API密钥和其他必要的信息。 2. 鉴权与认证&…...

使用Docker安装和部署kkFileView

&#x1f388;1 参考文档 kkFileView官方文档 &#x1f680;2 安装kkFileView 拉取Redis镜像。 docker pull keking/kkfileview启动docker容器。 docker run -it -d -p 8012:8012 keking/kkfileview --restart always解释&#xff1a; docker run redis # 从kkfileview镜像运行…...

胆囊结石3mm严重吗(解析胆囊结石的危害和处理方法)

胆囊结石是指胆囊内形成的固体结晶&#xff0c;大小不一&#xff0c;主要由胆固醇、胆汁色素和钙盐等物质组成。胆囊结石是一种比较常见的疾病&#xff0c;据统计&#xff0c;我国胆囊结石的患病率约为5%~10%左右。那么&#xff0c;胆囊结石3mm严重吗?下面就来一起了解一下。 …...

全新UI站长在线工具箱系统源码带后台开源版

该系统的全开源版本可供下载&#xff0c;并且支持暗黑模式。 系统内置高达72种站长工具、开发工具、娱乐工具等功能。此系统支持本地调用API&#xff0c;同时还自带免费API接口&#xff0c; 是一个多功能性工具程序&#xff0c;支持后台管理、上传插件、添加增减删功能。 环…...

maven的依赖下载不下来的几种解决方法

前言 每次部署测试环境&#xff0c;从代码库拉取代码&#xff0c;都会出现缺少包的情况。然后找开发一通调试&#xff0c;到处拷包。 方案一&#xff1a;pom文件注释/取消注释 注释掉pom.xml里的报红色的依赖&#xff08;同时可以把本地maven库repo里对应的包删除&#xff09;&…...

CAR-T商品化的第一步

1、CAR-T细胞的体外扩增能力 CAR-T细胞疗法需要先从患者体内获得T淋巴细胞&#xff0c;然后通过体外转基因技术 transduce CAR靶向结构域。这一过程需要在细胞培养体系中得到充分的扩增&#xff0c;以获得足够的治疗CAR-T细胞数量。因此&#xff0c;CAR-T细胞的体外扩增能力直…...

yolov2相较于yolov1的改进

目录 前言 BN层取代了Dropout 使用了高分辨率分类器 K-means选定先验框的尺寸 网络结构—darknet19 细粒度的特征 前言 yolov2是在yolov1的基础上进行改进的&#xff0c;主要解决了yolov1定位不准确以及检测重叠的物体极差的情况&#xff0c;总的来说&#xff0c;它有以下…...

如何在Spring Boot应用中使用Nacos实现动态更新数据源

&#x1f337;&#x1f341; 博主猫头虎 带您 Go to New World.✨&#x1f341; &#x1f984; 博客首页——猫头虎的博客&#x1f390; &#x1f433;《面试题大全专栏》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33a; &a…...

代码随想录算法训练营day1~18总结

时间、空间复杂度&#xff0c;解题过程中运用的函数补充说明 数组 day1&#xff1a; http://t.csdn.cn/dBSgY day2&#xff1a; http://t.csdn.cn/JTDvH 数组总结 链表 day3&#xff1a;http://t.csdn.cn/mJx9V day4&#xff1a;http://t.csdn.cn/qiGqz 链表总结 哈希表 day6:…...

【炼气境】HashMap原理以及如何使用

系列文章目录 文章目录 系列文章目录前言1、数据结构2、工作原理3、当两个对象的 hashCode 相同会发生什么&#xff1f;4、你知道 hash 的实现吗&#xff1f;为什么要这样实现&#xff1f;5、为什么要用异或运算符&#xff1f;6、HashMap 的 table 的容量如何确定&#xff1f;l…...

QT基础教程之七Qt消息机制和事件

QT基础教程之七Qt消息机制和事件 事件 事件&#xff08;event&#xff09;是由系统或者 Qt 本身在不同的时刻发出的。当用户按下鼠标、敲下键盘&#xff0c;或者是窗口需要重新绘制的时候&#xff0c;都会发出一个相应的事件。一些事件在对用户操作做出响应时发出&#xff0c…...

Python入门自学进阶-Web框架——40、redis、rabbitmq、git——3

git&#xff0c;一个分布式的版本管理工具。主要用处&#xff1a;版本管理、协作开发。 常见版本管理工具&#xff1a; VSS —— Visual Source Safe CVS —— Concurrent Versions System SVN —— CollabNet Subversion GIT GIT安装&#xff1a;下载安装文件&#xff1a;…...

skywalking agent监控java服务

一、前言 skywalking agent可以监控的服务类型有多种&#xff0c;python、go、java、nodejs服务等都可以监控&#xff0c;现在通过java服务来演示skywalking agent的使用&#xff0c;并且是使用容器的方式实现 二、部署skywalking agent监控 需要注意&#xff0c;skywalking…...

LARGE LANGUAGE MODEL AS AUTONOMOUS DECISION MAKER

本文是LLM系列文章&#xff0c;针对《LARGE LANGUAGE MODEL AS AUTONOMOUS DECISION MAKER》的翻译。 作为自主决策者的大语言模型 摘要1 引言2 前言3 任务形式化4 方法5 实验6 相关工作7 结论 摘要 尽管大型语言模型&#xff08;LLM&#xff09;表现出令人印象深刻的语言理解…...

【Unity-Cinemachine相机】Cinemachine Brain属性详解

在Package Manager中下载Cinemachine 创建一个Virtual Camera&#xff0c;然后会发现Main Camera后面多出了个标志&#xff0c;而且属性也不能再修改了 因为绑定了CinemachineBrain&#xff0c;它会读取场景中某个虚拟相机的配置&#xff0c;并以此配置来控制相机的行为&#x…...

使用Python对数据的操作转换

1、列表加值转字典 在Python中&#xff0c;将列表的值转换为字典的键可以使用以下代码&#xff1a; myList ["name", "age", "location"] myDict {k: None for k in myList} print(myDict) 输出&#xff1a; {name: None, age: None, loca…...

MyBatis-Plus —— 初窥门径

前言 在前面的文章中荔枝梳理了MyBatis及相关的操作&#xff0c;作为MyBatis的增强工具&#xff0c;MyBatis-Plus无需再在xml中写sql语句&#xff0c;在这篇文章中荔枝将梳理MyBatis-Plus的基础知识并基于SpringBoot梳理MyBatis-Plus给出的两个接口&#xff1a;BaseMapper和ISe…...

音频——I2S 标准模式(二)

I2S 基本概念飞利浦(I2S)标准模式左(MSB)对齐标准模式右(LSB)对齐标准模式DSP 模式TDM 模式 文章目录 I2S format时序图逻辑分析仪抓包 I2S format 飞利浦 (I2S) 标准模式 数据在跟随 LRCLK 传输的 BCLK 的第二个上升沿时传输 MSB&#xff0c;其他位一直到 LSB 按顺序传传输依…...

Python语音识别处理详解

概要 人们对智能语音助手的需求不断提高&#xff0c;语音识别技术也随之迅速发展。在这篇文章中&#xff0c;我们将介绍如何使用Python的SpeechRecognition和pydub等库来实现语音识别和处理&#xff0c;从而打造属于自己的智能语音助手。 1. 什么是语音识别&#xff1f; 语音…...

【小吉送书—第一期】Kali Linux高级渗透测试

文章目录 &#x1f354;前言&#x1f6f8;读者对象&#x1f388;本书资源&#x1f384;彩蛋 &#x1f354;前言 对于企业网络安全建设工作的质量保障&#xff0c;业界普遍遵循PDCA&#xff08;计划&#xff08;Plan&#xff09;、实施&#xff08;Do&#xff09;、检查&#x…...