AJAX原理及属性和方法

一、AJAX的工作原理


什么是AJAX?

AJAX——Asynchronous JavaScript and Xml,成为异步的JavaScript和Xml。其实质是使用XMLHttpRequest对象异步的向服务器请求,局部刷新页面,实现无刷新整个页面而实现改变页面局部内容。

AJAX工作原理图


二、xhr对象的属性和方法




发送异步请求的步骤:
1、创建xhr对象
var xhr=null;
if(window.XMLHttpRequest){
xhr=new XMLHttpRequest();
}else{
xhr=new ActiveXObject('Microsoft.XMLHTTP');//兼容IE
}

2.绑定事件监听函数
xhr.onreadystatechange=function(){

}


3.创建一个HTTP请求消息,打开一个针对服务器的连接
xhr.open(METHOD,URI,true);

METHOD——请求提交的方法,GET/POST
URI——请求提交的地址,如果使用GET方法,则需要在URI后面添加"k1=v1&k2=v2,..."传递参数
true——表示使用异步请求

4.发送请求
xhr.send(null);

*********如果使用POST方法,需要在发送请求之前设置消息头*********
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded")

请求消息Content-Type头常用的值:

text/plain:客户端向服务器提交的请求主体是普通文本数据(未编码)——很多web服务器会直接拒绝接收这样的数据
application/x-www-form-urlencoded:客户端向服务器提交的是经过了编码的文本数据——默认情况下,HTMLForm标签会把所有的数据编码后再提交给服务器
multipart/form-data:客户端向服务器提交的请求主体中包括上传的文件

相应消息的Content-Type头常用的值:

text/html  image/png  text/css  application/javascript  application/json.....
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值