【AJAX 教程】JS 原生 AJAX 请求

Hi 小朋友

已于 2022-05-23 23:24:50 修改

阅读量1.2k

点赞数 1

分类专栏： AJAX 基础教程文章标签： ajax javascript html5

于 2022-05-15 22:21:32 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_64172426/article/details/124788170

版权

JS 原生 AJAX 请求

1、创建 XMLHttpRequest 对象

2、设置响应 HTTP 请求状态变化的函数

onreadystatechange 事件

相关文章【AJAX 教程】Jquery 实现 AJAX 请求的三种方式

AJAX 简介

AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。

AJAX 是一种用于创建快速动态网页的技术。

通过在后台与服务器进行少量数据交换，AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

传统的网页（不使用 AJAX）如果需要更新内容，必需重载整个网页面。

一、JS 原生 AJAX 请求

实现 AJAX 的基本步骤

要完整实现一个AJAX 异步调用和局部刷新，通常需要以下几个步骤：

创建XML HttpRequest 对象，即创建一个异步调用对象。

创建一个新的HTTP 请求，并指定该HTTP 请求的方法，URL及验证信息

设置响应HTTP请求状态变化的函数。

发送HTTP 请求。

获取异步调用返回的数据。

使用JavaScript和DOM 实现局部刷新

XMLHttpRequest 对象

所有现代浏览器均支持 XMLHttpRequest 对象（IE5 和 IE6 使用 ActiveXObject）。

XMLHttpRequest 用于在后台与服务器交换数据。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

XMLHttpRequest 对象方法

方法	描述
new XMLHttpRequest()	创建新的 XMLHttpRequest 对象
abort()	取消当前请求
getAllResponseHeaders()	返回头部信息
getResponseHeader()	返回特定的头部信息
open(method, url, async, user, psw)	规定请求 method：请求类型 GET 或 POST url：服务器文件位置 async：true（异步）或 false（同步） user：可选的用户名称 psw：可选的密码
send()	将请求发送到服务器，用于 GET 请求
send(string)	将请求发送到服务器，用于 POST 请求
setRequestHeader()	向要发