Web阶段:第二十章:Ajax请求

发布时间 2023-09-01 17:17:56作者: 忘川信使

什么是Ajax请求?
AJAX即“Asynchronous Javascript And XML”(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术。
ajax是一种浏览器异步发起请求。局部更新页面的技术。
1、异步发起请求
2、局部更新页面

原生Ajax请求的实现(了解)

<script type="text/javascript">
function ajaxRequest() {
1
2
// 1、我们首先要创建XMLHttpRequest
var xmlHttpRequest = new XMLHttpRequest();
// 2、调用open方法设置请求参数
xmlHttpRequest.open(“GET”, “http://localhost:8080/day17/ajaxServlet?action=javaScriptAjax”, true);
// 4、在send方法前绑定onreadystatechange事件,处理请求完成后的操作。
xmlHttpRequest.onreadystatechange = function(){
if (xmlHttpRequest.readyState == 4 && xmlHttpRequest.status == 200) {
alert(“响应回来啦”);
// alert(“服务器返回的数据是:” + xmlHttpRequest.responseText);
var jsonObj = JSON.parse( xmlHttpRequest.responseText );
// alert( “编号:” + jsonObj.id + “,姓名:” + jsonObj.name );
document.getElementById(“div01”).innerHTML = “编号:” + jsonObj.id + “,姓名:” + jsonObj.name;
}
}
// 3、调用send方法发送请求
xmlHttpRequest.send();
alert(“这是请求后面的代码”);
}

Jquery中的Ajax请求
$.ajax方法
url 请求的地址
type 请求的方式GET或POST
data 请求的参数(发送给服务器的数据)
支持两种格式
一:name=value&name=value
二: { 属性名:值 }

success 请求成功后响应的函数
dataType 服务器回传的数据类型
1.text返回纯文本、
2.xml、
3.json返回json对象

案例:

// ajax请求
$("#ajaxBtn").click(function(){

$.ajax({
url:"http://localhost:8080/day17/ajaxServlet",
type:"GET",

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/120716873