一、概念:
在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页内容。
必须在浏览器上执行。
二、实现过程
//创建Ajax的核心对象XMLHttpRequest,它是ajax的基础
const xhr = new XMLHttpRequest();
//与服务端建立连接
xhr.open(method, url, async); //async true/false 默认为true
//添加http头
xhr.setRequestHeader('Content-type','application/x-www-form-urlencoded')
//向服务端发起请求
xhr.send();
//监听响应状态
xhr.onreadystatechange = function(){
//请求未完成
if(request.readyState !== 4) return;
//请求已成功
if(xhr.status === 200){
console.log(xhr.responseText); //字符串形式的响应数据
console.log(xhr.responseXml); //xml形式的响应数据
}
}
请求方式get/post区别
请求方式:get拼接在url后,post是在send请求体中;
请求数量:get 有数量限制,post没有数量限制;
安全性:post安全性较高;
请求状态readyState
- 0: 请求未初始化
- 1: 服务器连接已建立
- 2: 请求已接收
- 3: 请求处理中
- 4: 请求已完成,且响应已就绪