1.1、JQuery的GET方式实现AJAX
核心语法：$.get(url,[data],[callback],[type]);
url：请求的资源路径。
data：发送给服务器端的请求参数，格式可以是key=value，也可以是 js 对象。
callback：当请求成功后的回调函数，可以在函数中编写我们的逻辑代码。
type：预期的返回数据的类型，取值可以是 xml, html, js, json, text等。
代码实现
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>用户注册</title></head><body><form autocomplete="off">姓名：<input type="text" id="username"><span id="uSpan"></span><br>密码：<input type="password" id="password"><br><input type="submit" value="注册"></form></body><script src=https://news.ytian678.com/skin/default/image/nopic.gif () {let username = $("#username").val();//2.jQuery的GET方式实现AJAX$.get(//请求的资源路径"userServlet",//请求参数"username=" + username,//回调函数function (data) {//将响应的数据显示到span标签$("#uSpan").html(data);},//响应数据形式"text");});</script></html>1.2、JQuery的POST方式实现AJAX
核心语法：$.post(url,[data],[callback],[type]);
url：请求的资源路径。
data：发送给服务器端的请求参数，格式可以是key=value，也可以是 js 对象。
callback：当请求成功后的回调函数，可以在函数中编写我们的逻辑代码。
type：预期的返回数据的类型，取值可以是 xml, html, js, json, text等。
代码实现
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>用户注册</title></head><body><form autocomplete="off">姓名：<input type="text" id="username"><span id="uSpan"></span><br>密码：<input type="password" id="password"><br><input type="submit" value="注册"></form></body><script src=https://news.ytian678.com/skin/default/image/nopic.gif () {let username = $("#username").val();//2.jQuery的POST方式实现AJAX$.post(//请求的资源路径"userServlet",//请求参数"username=" + username,//回调函数function (data) {//将响应的数据显示到span标签$("#uSpan").html(data);},//响应数据形式"text");});</script></html>1.6、JQuery的通用方式实现AJAX
核心语法：$.ajax({name:value,name:value,…});
url：请求的资源路径。
async：是否异步请求，true-是，false-否 (默认是 true)。
data：发送到服务器的数据，可以是键值对形式，也可以是 js 对象形式。
type：请求方式，POST 或 GET (默认是 GET)。
dataType：预期的返回数据的类型，取值可以是 xml, html, js, json, text等。
success：请求成功时调用的回调函数。
error：请求失败时调用的回调函数。
代码实现
<!DOCTYPE html><html lang="en"><head><meta charset="UTF-8"><title>用户注册</title></head><body><form autocomplete="off">姓名：<input type="text" id="username"><span id="uSpan"></span><br>密码：<input type="password" id="password"><br><input type="submit" value="注册"></form></body><script src=https://news.ytian678.com/skin/default/image/nopic.gif () {let username = $("#username").val();//2.jQuery的通用方式实现AJAX$.ajax({//请求资源路径url:"userServletxxx",//是否异步async:true,//请求参数data:"username="+username,//请求方式type:"POST",//数据形式dataType:"text",//请求成功后调用的回调函数success:function (data) {//将响应的数据显示到span标签$("#uSpan").html(data);},//请求失败后调用的回调函数error:function () {alert("操作失败...");}});});</script></html>1.7、小结
AJAX(Asynchronous Javascript And XML)：异步的 Javascript 和 XML。
通过浏览器与服务器进行少量数据交换，就可以使网页实现异步更新。也就是在不重新加载整个页面的情况下，对网页的部 分内容进行局部更新。
同步和异步
同步：服务器端在处理过程中，无法进行其他操作。
异步：服务器端在处理过程中，可以进行其他操作。
GET 方式实现：$.get();
POST 方式实现：$.post();
url：请求的资源路径。
data：发送给服务器端的请求参数，格式可以是key=value，也可以是 js 对象。
callback：当请求成功后的回调函数，可以在函数中编写我们的逻辑代码。
type：预期的返回数据的类型，取值可以是 xml, html, js, json, text等。
通用方式实现：$.ajax();
url：请求的资源路径。
async：是否异步请求，true-是，false-否 (默认是 true)。
data：发送到服务器的数据，可以是键值对形式，也可以是 js 对象形式。
type：请求方式，POST 或 GET (默认是 GET)。
dataType：预期的返回数据的类型，取值可以是 xml, html, js, json, text等。
success：请求成功时调用的回调函数。
error：请求失败时调用的回调函数。
