本以为自己是做.net的,做项目就做技术含量高的,对那些网站前端根本不屑一顾。但最新的web项目只从美工和前端engineer那得到了些演示demo,光凭这些根本达不到要求,用户体验也相当的不爽。美工抽不身,我们几个搞后台的只能自己动手,硬着头皮调css,javascrip,后来发现ajax 确实挺管用,所以课余时间找了本书看看,闲暇时摘些关键桥段全当涂鸦吧。
    1.到底什么是Ajax。
    Ajax最初是Asynchronous JavaScript+XML (异步JavaScript+XML)的缩写,后来把允许浏览器与服务器通信而无需刷新当前页面的技术都涵盖在内了。
    传统的web应用允许用户填写表单(form),当提交表单时就向web服务器发送一个请求。服务器接收并处理传来的表单,然後返回一个新的网页。这个做法浪费了许多带宽,因为在前後两个页面中的大部分HTML代码往往是相同的。由于每次应用的交互都需要向服务器发送请求,应用的响应时间就依赖于服务器的响应时间。这导致了用户界面的响应比本地应用慢得多。
    与此不同,AJAX应用可以仅向服务器发送并取回必需的数据,它使用SOAP或其它一些基于XML的web service接口,并在客户端采用JavaScript处理来自服务器的响应。因为在服务器和浏览器之间交换的数据大量减少,结果我们就能看到响应更快 的应用。同时很多的处理工作可以在发出请求的客户端机器上完成,所以Web服务器的处理时间也减少了。
    2.ajax 的优缺点
     ajax动态修改页面的功能使得浏览器无需刷新整个页面即可完成与服务器的通信操作,避免了服务器回发重复页面信息,减轻了带宽负担,加快了响应速度。也正因为ajax局部刷新页面,使得前一状态的页面信息无法保存在历史纪录中,浏览器的后退操作也无法正确获取历史页面。开发人员针对这一问题已想出一些解决的办法,例如,将动态页面放入iframe 中,如何获得每一个状态都会有相应的参数保存在静态的主页面中,当后退时只需通过这些参数重新获得历史状态的动态页面。
    3.基础原理
    ajax 的关键是XMLHttpRequest 对象的应用。
标准交互模式:
    1) 触发ajax 事件
    2)建立CMLHttpRequest对象的一个实例。使用open()调用服务器处理程序文件。
    3)向服务器发送请求
    4)服务器处理程序
    5)请求返回浏览器
    6)对服务器的返回 进行处理
<script type="text/javascript" >
    var xmlhttp;
function Createxmlhttp()
{ alert("Start Create");
    if(window.ActiveXObject)
    {
        alert("ActiveXObject");
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }else if (window.XMLHttpRequest)
    {
    alert("XMLHttpRequest");
    xmlhttp=new XMLHttpRequest();
    }
  
    xmlhttp.open("Get","Upload.aspx")
    xmlhttp.onreadystatechange=CallBack;
    xmlhttp.send(null);
}
function CallBack()
{
    alert("Call Back");
}

</script>