AJax技术

传智播客:ajax学习笔记

字号+ 作者:H5之家 来源:H5之家 2015-10-08 17:30 我要评论( )

Ajax不是一个技术,而是好几个技术的结合: 1.使用XHTML和CSS的基于标准的表示技术 2.使用Dom即使进行动态显示和交互。解决页面数据获取,服务器返回数据的解析,五刷新页面的更新。 3.使用XML和XSLT进行数据交换和处理,XML是Ajax常用的数据传输格式,但并

Ajax不是一个技术,而是好几个技术的结合:
1.使用XHTML和CSS的基于标准的表示技术
2.使用Dom即使进行动态显示和交互。解决页面数据获取,服务器返回数据的解析,五刷新页面的更新。
3.使用XML和XSLT进行数据交换和处理,XML是Ajax常用的数据传输格式,但并不是必须要使用Xml,也可以使用不同文本格式。比如google就是使用纯文本进行数据传输。
4.使用XMLHTTPRequest进行数据检索。解决了异步交互。
5.使用JavaScript把上面的技术融合起来。是实现数据从“页面--服务器---页面”的桥梁。

传统模式下Http请求的发送和服务器响应结果的接收都是由浏览器完成的。同时服务器响应的结果是一个新的Html页面。
传统模式中,浏览器通过表单(Form)组织数据并提交到服务器并且接收服务器返回的页面。

Ajax发送Http请求和接收服务器响应都是通过Ajax引擎完成的。服务器端的响应结果是数据(XML格式或不同文本格式),而不是像传统模式下以新的页面为响应结果。响应结果会通过注册在Ajax引擎上的回调方法来执行响应操作并显示给客户。
Ajax中,通过JavaScript获取页面上需要处理的数据,通过Ajax引擎把这些数据发送到服务器,同时还要在Ajax引擎上注册响应的回调方法。但服务器把处理后的数据返回到Ajax引擎就调用回调方法中的相关数据把服务器返回的数据呈现给用户。
Ajax中服务器端做的工作比传统方式要少一些。两者都要进行数据的接收和处理,但是Ajax接收的数据,返回的也是数据,而不是传统方式的整个页面。

关于XMLHttpRequest对象的历史
最早的XMLHttpRequest是IE5.0中以ActiveX控件的形式出现的,后来Mozilla,Safari,Opera等浏览器厂商都支持了XMLHttpRequet对象。也就是说在这些浏览器中,可以直接定义XMLHttpRequest对象。
但是对于IE6以前的版本,该对象只能够以ActiveX来创建XMLHttpRequest对象。
正是由于不同浏览器对XMLHttpRequest对象的支持程度不同,导致在实际开发过程中为了在不同浏览器都能实现功能,创建这个对象就比较麻烦,下面是一个创建XMLHttpRequest对象的例子。
if(window.XMLHttpRequest){
//如果用户的浏览器支持XMLHttpRequest对象,就可以直接new了
//对于IE7,IE8,firefox,Mozilla,Safari浏览器都能满足这个条件
                  xmlhttp=new XMLHttpRequest();
                  if(xmlhttp.overrideMimeType){
                      xmlhttp.overrideMimeType("text/xml");
                  }
              }else if(window.ActiveXObject){
//如果浏览器不能直接支持new XMLHttpRequest()就只能使用Activex来创建了,但是前提是该浏览器能支持Activex控件。
//上面的浏览器也能满足这个条件,但是上面的自带了XMLHttpRequest对象,所以没有必要再利用这个来创建。
//由于不同版本的Activex控件不同,这里使用所以可能的版本来创建XMLHttpRequest对象,只要有一个控件创建成功,就break出去。
                  activexName=["MSXML2.XMLHTTP6.0","MSXML2.XMLHTTP5.0",
                  "MSXML2.XMLHTTP4.0","MSXML2.XMLHTTP3.0","MSXML2.XMLHTTP",
                   "Miscrosoft.XMLHTTP"];
                  for(var i=0;i<activexName.length;i++){
                      try{
尝试使用当前这个ActiveX控件创建XMLHttpRequest对象
                          xmlhttp=new ActiveXObject(activexName)

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • JQuery实现Ajax加载图片的方法

    JQuery实现Ajax加载图片的方法

    2016-02-24 17:01

  • 判断用户是不是为ajax请求

    判断用户是不是为ajax请求

    2016-02-24 17:00

  • Ajax与WEB开发 by alixixi.com

    Ajax与WEB开发 by alixixi.com

    2016-02-11 11:02

  • jQuery.ajax()的相关参数及使用

    jQuery.ajax()的相关参数及使用

    2016-02-08 16:00

网友点评