JavaWeb之Ajax的基本使用

目录

一、Ajax是什么？

二、为什么使用Ajax？

三、Ajax基本使用

 四、案例

无刷新登录（ajax、get、post）💫

login.jsp

 LoginServlet.java

查询名字是否存在💫

register.java

 FindServlet.java

使用搜索框时弹出的提示💫

index.java

---

一、Ajax是什么？

1. Ajax，全称Asynchronous JavaScript and XML ，也就是异步加载的javascript 和 XML
2. .Ajax是一种用于创建快速动态网页的技术。
3. 通过在后台与服务器进行少量数据交换，Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

JavaScript：更新局部的网页

XML：一般用于请求数据和响应数据的封装

XMLHttpRequest对象：发送请求到服务器并获得返回结果

CSS：美化页面样式  

异步：发送请求后不等返回结果，由回调函数处理结果

---

二、为什么使用Ajax？

🔘无刷新：不刷新整个页面，只刷新局部

🔘无刷新的好处：只更新部分页面，有效利用带宽，提高用户体验

---

三、Ajax基本使用

🟣通过 HTTP 请求加载远程数据。

1、$.ajax()

常用参数	说明
url	一个用来包含发送请求的URL字符串(请求地址)
type	请求方式 (“POST” 或 “GET“[默认])
data	发送到服务器的数据(参数)
dataType	预期服务器返回的数据类型(xml、json、text)
dataType	请求成功的回调函数
error	请求失败的回调函数

🟣通过远程 HTTP POST /GET请求载入信息。

这是一个简单的 POST /GET请求功能以取代复杂 $.ajax 。请求成功时可调用回调函数。如果需要在出错时执行函数，请使用 $.ajax。

2、$.post()

常用参数	说    明
url	一个用来包含发送请求的URL字符串(请求地址)
data	发送到服务器的数据(参数)  key/value
success(data)	请求成功的回调函数
type	返回内容格式(xml、json、text等)

 3.$.get()

常用参数	说    明
url	一个用来包含发送请求的URL字符串(请求地址)
data	发送到服务器的数据(参数)  key/value
success(data)	请求成功的回调函数
type	返回内容格式(xml、json、text等)

三种方法代码如下：

 $.get