一、ajax简介
ajax (Asynchronous Javascript And XML)其实就是异步的javaScript和XML。
XML:<html>这是html标签,XML格式是一样的 可以自定义<name> <age> 满足标记语言的格式就可以了。
AJAX不是一门新语言,是综合HTTP异步通信 、JS、XML、以及JSON等多种网络技术的一种编程模型。
AJAX ~= JS+ xml+JSON + HTTP通信,本质就是在HTTP协议的基础上以异步的方式与服务器进行通信。
二、ajax的优缺点
优点:
ajax别称 叫做无刷新技术 比如地图、局部加载
1.页面局部刷新。在读取数据的过程中,用户所面对的不是白屏,而是原来页面的转台,或者正在更新的信息提示状态,只有当接收到全部数据后才更新相应部分的内容,而这种更新也是瞬间的用户几乎感觉不到 。
2.可以充分利用客户端闲置的处理能力,减轻服务器和网路传输的负担 。
3.使web中界面与应用相分离 也可以说是数据与呈现相分离。
缺点:
1.AJAX干掉了Back和History功能,即对浏览器机制的破坏。
2.AJAX的安全问题。
AJAX 技术给用户带来很好的用户体验的同时也对IT企业带来了新的安全威胁,Ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比 以前更多的数据和服务器逻辑。Ajax的逻辑可以对客户端的安全扫描技术隐藏起来,允许黑客从远端服务器上建立新的攻击。
3.对搜索引擎支持较弱。
对搜索引擎的支持比较弱。如果使用不当,AJAX会增大网络数据的流量,从而降低整个系统的性能。
4.破坏程序的异常处理机制。
至少从目前看来,像Ajax.dll,Ajaxpro.dll这些Ajax框架是会破坏程序的异常机制的。关于这个问题,曾在开发过程中遇到过,但是查了一 下网上几乎没有相关的介绍。后来做了一次试验,分别采用Ajax和传统的form提交的模式来删除一条数据……给我们的调试带来了很大的困难。
5.违背URL和资源定位的初衷。
例如,我给你一个URL地址,如果采用了Ajax技术,也许你在该URL地址下面看到的和我在这个URL地址下看到的内容是不同的。这个和资源定位的初衷是相背离的。
6.AJAX不能很好支持移动设备。
一些手持设备(如手机、PDA等)现在还不能很好的支持Ajax,比如说我们在手机的浏览器上打开采用Ajax技术的网站时,它目前是不支持的。
7.客户端过肥,太多客户端代码造成开发上的成本。
编写复杂、容易出错 ;冗余代码比较多(层层包含js文件是AJAX的通病,再加上以往的很多服务端代码现在放到了客户端);破坏了Web的原有标准。
三、ajax处理网络请求
Ajax模块在处理网络请求的时候包括以下四个步骤
1.通过XMLHttpRequest类创建xhr对象
2.为xhr对象添加属性与回调方法
3.令xhr对象执行open()方法,指明请求被发往某处
4.令xhr对象执行send()方法,发出请求。
xhr对象发送GET、POST请求
//1.创建对象
var xhr;
if (window.XMLHttpRequest){//普通浏览器
xhr=new XMLHttpRequest();
}else{//老版本IE
xhr=new ActiveXObject("Microsoft.XMLHTTP");
}
//3.监听服务器响应
xhr.onreadystatechange=function(){
if(xhr.readyState==4&&xhr.status==200){
console.log(xhr.responseText);//将接收到的服务器数据显示到控制台中
}
};
//2.打开链接
xhr.open("请求方式","请求地址",是否异步:默认为异步true);
//3.5 请求头(POST请求时设置)
xhr.setRequestHeader("Content-type","application/x-www-form-urlencoded");
//4.发送请求
xhr.send();