标签：请求 认识 创建 send xhr AJAX open onreadystatechange
目录
一、认识ajax
AJAX 是 Asyn JavaScript And XML(异步JavaScript 和 XML) 的首字母缩写。
AJAX 并不是一种新的编程语言，而是一种使用现有标准的新方法，AJAX是在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的艺术
AJAX 的核心是 XMLHttpRequest 对象
1.AJAX 基于开放的标准
- JavaScript
- XML
- HTML
- CSS
2.XMLHttpRequest 对象的三个常用的属性
1. onreadystatechange 属性
onreadystatechange 属性存有处理服务器响应的函数。
xmlHttp.onreadystatechange = function() {
//需要写的代码
}2. readyState 属性
readyState 属性存有服务器响应的状态信息。
readyState属性有五个状态值。
0：是uninitialized，未初始化。已经创建了XMLHttpRequest对象但是未初始化。
1：是loading，send for request but not called .已经开始准备好要发送了。
2：是loaded, send called,headers and status are available。已经发送，但是还没有收到响应。
3：是interactive，downloading response,but responseText only partial set.正在接受响应，但是还不完整。
4：是completed，finish downloading.接受响应完毕。
在 onreadystatechange 函数里 可以使用if来测试响应是否完成
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
//从服务器的response获得数据
}
}3. responseText 属性
可以通过 responseText 属性来取回由服务器返回的数据。
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState == 4) {
document.myForm.time.val = xmlHttp.responseText;
}
}3.XMLHttpRequest 对象的方法
1.open（）：
打开XMLHttpRequest对象。有三个参数：
method 方法有get，post，delete，put。如果查数据，从服务器中得到数据，使用get。如果直接提交到服务器中，更新数据，则使用post；
url 是请求资源的地址。
boolean 表示是否使用异步。默认情况是true，因为ajax的特点就是异步传送。若使用同步则false。
xmlHttp.open("GET","url",true);2.send（）：
将请求发往服务器。其中发送的内容可以是需要的参数，若是没有参数，直接send（null)
xmlHttp.send(null);二.原生AJAX创建的过程
1.创建xhr核心对象
var xhr=new XMLHttpRequest();2.调用open准备发送
参数一：请求方式
参数二：请求地址
参数三：true异步，false同步
xhr.open('post','http://www.baidu.com/api/search',true)3.如果是post请求，必须设置请求头
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded')4.调用send发送请求（如果不需要参数，就写null）
xhr.send('user=tom&age=10&sex=女')5.监听异步回调 onreadystatechange
判断readyState 为4 表示请求完成
判断readyStatus 状态码 为 200 表示接口请求成功
responeseText 为相应数据。字符串类型。
xhr.onreadystatechange=function(){
if(xhr.readyState==4){
if(xhr.status==200){
console.log(xhr.responseText);
var res=JSON.parse(xhr.responseText);
console.log(res);
if(res.code==1){
modal.modal('hide');
location.reload();
}
}
}备注：如果是post请求，想要传json格式数据。
1.设置请求头
xhr.setRequestHeader('Content-Type', 'application/json')2.open发送数据
xhr.open({_id:xxx,user:xxxx,age:xxxx})标签：请求,认识,创建,send,xhr,AJAX,open,onreadystatechange 来源： https://blog.csdn.net/m0_65558076/article/details/122230609
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。