Rumah >hujung hadapan web >tutorial js >ajax的原理是什么?ajax的常用属性和原理的分析(总结篇)

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

寻∝梦
寻∝梦asal
2018-09-10 16:22:511475semak imbas

本篇文章主要的讲述了关于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使用手册栏目中学习),有问题的可以在下方留言提问。

Atas ialah kandungan terperinci ajax的原理是什么?ajax的常用属性和原理的分析(总结篇). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn