AJAX基础知识

定义
Ajax 异步 JavaScript 和 XML ( async javascript and xml ),使用 Ajax 技术网页应用能够快速地将数据更新呈现在用户界面上,而不需要重载(刷新)整个页面,这使得程序能够更快地回应用户的操作.
javascript :用于无刷新的更新页面
xml 是一种数据格式,目的是为了存储和传递数据
XMLHttpRequest 对象:这是一个浏览器内置对象,可以向指定的地址发送请求
在后来开发实践中,人们开始抛弃 xml ,而是用 json 作为数据存储和传递的格式

定时获取时间案例

readystate
AJAX 请求会经历很多阶段,通过 readyState 属性的值,可以知道请求当前正处于哪个阶段
readyState 存放 xhr 的状态信息,从 0-4 发生变化:
0 :请求未初始化
1 :服务器已建立连接
2 :请求已接收
3 :请求处理中
4 :请求已完成,且响应已完成

为什么要加入判断

请求方式
ajax 常用的请求方式
get :从服务端获取数据
post :向服务端提交数据,用于新增
put :向服务端提交数据,用于修改
delete :删除数据
发送 get 请求:

发送post请求:

发送 put 请求:

发送 delete 请求:


服务端处理:

总结:
前后端分离项目开发中,不同的目的要使用不同的请求方式.
针对同一个资源(比如博客)的增删改查,请求的接口一般是一样的,服务端会通过获取请求方
式,然后将不同的请求转发给不同的代码来处理

相关推荐
Elieal16 小时前
深入浅出:Ajax 与 Servlet 实现前后端数据交互
前端·ajax·servlet
Allen Bright2 天前
【JS-7-ajax】AJAX技术:现代Web开发的异步通信核心
前端·javascript·ajax
白仑色2 天前
AJAX表单验证项目实战:实时用户名检查
前端·javascript·ajax·表单验证·py
典学长编程4 天前
前端开发(HTML,CSS,VUE,JS)从入门到精通!第五天(jQuery函数库)
javascript·css·ajax·html·jquery
杨DaB4 天前
【项目实践】在系统接入天气api,根据当前天气提醒,做好plan
java·后端·spring·ajax·json·mvc
她说人狗殊途5 天前
Ajax笔记
前端·笔记·ajax
一只小风华~5 天前
JavaScript:Ajax(异步通信技术)
前端·javascript·ajax·web
典学长编程5 天前
前端开发(HTML,CSS,VUE,JS)从入门到精通!第四天(DOM编程和AJAX异步交互)
javascript·css·ajax·html·dom编程·异步交互
2401_837088507 天前
AJAX快速入门 - 四个核心步骤
前端·javascript·ajax
知识分享小能手7 天前
Vue3 学习教程,从入门到精通,Vue3 中使用 Axios 进行 Ajax 请求的语法知识点与案例代码(23)
前端·javascript·vue.js·学习·ajax·vue·vue3