JS的Ajax入门【了解】
简单来说:==Ajax是一门动态网页技术,发送异步请求,实现在不重新加载整个页面的情况下,实现页面局部刷新,提高用户体验。==
同步:就是事情要一件一件的做,做完上一件,才能继续做下一件事。
异步:两个不同的对象在做事,(多线程)
使用Ajax发送异步请求,就需要额外创建一个对象 XMLHttpRequest 异步请求对象
涉及到的API
XMLHttpRequest:异步请求发送对象
XMLHttpRequest的对象的API
open() :打开连接。传递三个参数。第一个是请求方式(GET/POST),第二个是请求路径,第三个是否是异步的(默认就是异步,不需要这个参数)。
send([post请求的参数]): 发送请求。
setRequestHeader():解决POST请求参数的问题。 key和值 content-type
响应结果
response.getWriter().print("Hello Ajax");
-
js实现ajax的步骤
-
创建异步请求发送对象
-
打开连接
-
发送请求
-
监听异步请求发送对象状态变化 进行处理
-
-
ajax请求和普通web请求的区别
-
ajax请求发送的是异步请求 普通web请求发送的是同步请求
-
ajax请求 服务器响应的是数据 ,普通web请求 服务器响应的是整个页面
-
-
使用js实现ajax请求,步骤繁琐,需要注意浏览器的兼容性问题,开发效率低,所以,实际开发中,我们一般都会使用jQuery的ajax或vue的axios实现发送异步请求。
为什么要使用JQuery的AJAX
jQuery中的ajax实现对js中的ajax实现做了封装,帮助我们处理好了浏览器兼容性,以及将模板代码封装了,我们只需要简单==调用一个方法就可以实现发送ajax请求==了,简单方便!
url:请求地址 必须项
data:可选项 请求参数
callback:可选项 表示请求成功处理函数
dataType:可选项 后台响应数据类型 默认text,常用json