欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  web前端

ajax的原理是什么?ajax的常用属性和原理的分析(总结篇)

程序员文章站 2022-05-06 16:38:55
...
本篇文章主要的讲述了关于ajax的自己一些总结,一些问题以及一些答案,希望能帮助到大家。现在就让我们一起来看这篇文章吧

首先ajax是Asynchronous JavaScript and XML的全称,Asynchronous是异步的意思,这跟传统的web不同。

什么是同步什么是异步?

同步,是发送方发送数据之后,必须等接收方接收数据必须做出回应之后,才可以进行下一步。

异步的话则是发送方发送数据之后不需等接收方做出回应,可以进行下一步操作。

举个形象的例子,同步就像A叫B去吃饭,A发出邀请,要B一起吃饭,此时必须等B做出回应,吃或者不吃,A才决定是一个人吃还是等B一起去;而异步的话就像是下班了,A跟B说A要去吃饭了,然后走了,不管B是否做任何回应。

Ajax原理

简单来说,就是通过XMLHttpRequest对象像服务器发送异步请求,从服务器获取数据之后,再通过JS来操作DOM节点。

XMLHttpRequest对象

方法:

1.open(请求类型,url,布尔值)

2.send()参数为作为请求主体发送的数据,如果不需要请求主体发送数据,则传入null

3.abort()取消异步请求

4.getAllResponseHeaders()把HTTP请求的所有响应首部作为键/值对返回

5.getResponseHeader("header")返回指定首部的串值

6.setRequestHeader("header", "value")把指定首部设置为所提供的值。在设置任何首部之前必须先调用open()。设置header并和请求一起发送 ('post'方法一定要 )

ajax的常用属性:

1.readyState 表示请求/响应过程的当前活动阶段(0:未初始化,尚未调用open方法;1:启动,已调用open方法,未调用send方法;2:发送:已调用send,未接到响应;3:接收,已经接收部分响应数据;4.完成,可以在客户端使用)

2.onreadystatechange readyState的值改变一次就会调用一次这个方法(想看更多就到PHP中文网AJAX开发手册栏目中学习)

3.responseText 作为响应主体被返回的文本

4.responseXML 保存响应类型为“text/xml”或"application/xml"的响应数据的XML DOM文档

5.status 响应的HTTP状态

6.statusText Http状态的说明

下面创建一个XHR对象:

function createXHR(){
if(typeof XMLHttpRequest != "undefined"){
return new XMLHttprequest();
}else if(typeof ActiveXObject != "undefined"){
if(typeof arguments.callee.sctiveXString != "string"){
var versions = ["MSXML2.XMLHttp.6.0","MSXML2.XMLHttp.3.0","MSXML2.XMLHttp"],i,len;
for(i =0;i<versions.length;i<len;i++){
try{
new ActiveXObject(versions[i]);
arguments.callee.activeXString = versions[i];
break;
}catch(ex){
跳过
}
}
}
return new ActiveXObject(arguments.callee.activeXString);
}else{
throw new Error("No XHR object available");
}
}
var xhr = createXHR();
xhr.onreadyststechange = function(){
if(xhr.readyState == 4){
if((xhr.status >= 200 && xhr.status <300) || 304){
alert(xhr.responseText);
}else{
alert("请求位成功"+ xhr.status);
}
}
};
xhr.open("get","aaa.txt",true);
xhr.send(null);

ajax优点:

1.无刷新更新数据,减少用户等到时间,更好的用户体验

2.异步与服务器通信,无需打断用户,响应更加迅速

3.可以把服务器的一些负担转到客户端,利用客户端闲置的能力来处理,减轻服务器和带宽的负担,节约空间和宽带租用成本。并且减轻服务器的负担,AJAX的原则是“按需取数据”,可以最大程度的减少冗余请求和响应对服务器造成的负担,提升站点性能。

5.基于标准化,广泛被支持

ajax缺点

1.破坏了前进后退功能,用户往往通过后退按钮来取消上一步操作,但是使用ajax无法实现。可以使用Gmail来解决这个问题,它只是采用的一个比较笨但是有效的办法,即用户单击后退按钮访问历史记录时,通过创建或使用一个隐藏的IFRAME来重现页面上的变更。

2.安全问题。ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比以前更多的数据和服务器逻辑。ajax的逻辑可以对客户端的安全扫描技术隐藏起来,允许黑客从远端服务器上建立新的攻击。还有自身受到如跨站脚本攻击,SQL注入等攻击。

3.对搜索引擎支持较弱

4.一些手持设备不能很好的支持等

本篇文章到这就结束了(想看更多就到PHP中文网AJAX使用手册栏目中学习),有问题的可以在下方留言提问。

以上就是ajax的原理是什么?ajax的常用属性和原理的分析(总结篇)的详细内容,更多请关注其它相关文章!

相关标签: ajax ajax原理