AJAX的工作流程有哪些？ajax的工作流程介绍（附实例）

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了AJAX的工作流程有哪些？ajax的工作流程介绍（附实例），小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含4259字，纯文字阅读大概需要7分钟。

内容图文

本篇文章主要讲述了关于ajax的工作流程情况，还有ajax原理，一些常用的属性介绍，现在让我们一起来看这篇文章吧

AJAX全称为"Asynchronous JavaScript and XML"（异步JavaScript和XML）。

是一种创建交互式网页应用的网页开发技术。它：
使用XHTML+CSS来表示信息；
使用JavaScript操作DOM（Document Object Model）进行动态显示及交互；
使用XML和XSLT进行数据交换及相关操作；
使用XMLHttpRequest对象与Web服务器进行异步数据交换；
使用JavaScript将所有的东西绑定在一起。
AJAX原理:
AJAX不是指一种单一的技术，而是有机地利用了一系列相关的技术。它的核心是JavaScript对象XmlHttpRequest，这个对象使我们可以使用JavaScript向服务器提出请求并处理响应，而不阻塞用户。AJAX采用异步交互过程，它在用户与服务器之间引入一个中间媒介，从而消除了网络交互过程中的处理—等待—处理—等待缺点。用户的浏览器在执行任务时即装载了AJAX引擎，AJAX引擎用JavaScript语言编写，通常藏在一个隐藏的框架中。它负责编译用户界面及与服务器之间的交互。AJAX引擎允许用户与应用软件之间的交互过程异步进行，独立于用户与网络服务器间的交流。现在，可以用Javascript调用AJAX引擎来代替产生一个HTTP的用户动作，内存中的数据编辑、页面导航、数据校验这些不需要重新载入整个页面的需求可以交给AJAX来执行，使用AJAX，可以为JSP、开发人员、终端用户带来可见的便捷。
既然Ajax的核心是XmlHttpRequest对象那就必须得介绍一下：
常用属性：
Onreadystatechange 指定当readyState属性改变时的事件处理函数。只写
readyState 表示Ajax请求的当前状态。只读它的值用数字代表。
0 代表未初始化。 还没有调用 open 方法
1 代表正在加载。 open 方法已被调用，但 send 方法还没有被调用
2 代表已加载完毕。send 已被调用。请求已经开始
3 代表交互中。服务器正在发送响应
4 代表完成。响应发送完毕
每次 readyState 值的改变，都会触发 readystatechange 事件。
responseText 将响应信息作为字符串返回.只读。它是一个HTML,XML或普通文本，这取决于服务器发送的内容。当 readyState 属性值变成 4 时, responseText 属性才可用，表明 Ajax 请求已经结束。
responseXML 将响应信息格式化为Xml Document对象并返回，只读，只有服务器发送了带有正确首部信息的数据时， responseXML 属性才是可用的。 MIME 类型必须为 text/xml
status 返回当前请求的http状态码.只读
常用状态码及其含义：
404 没找到页面(not found)
403 禁止访问(forbidden)
500 内部服务器出错(internal service error)
200 一切正常(ok)
304 没有被修改(not modified)(服务器返回304状态，表示源文件没有被修改 )
在 XMLHttpRequest 对象中，服务器发送的状态码都保存在 status 属性里。通过把这个值和 200 或 304 比较，可以确保服务器是否已发送了一个成功的响应（想看更多就到PHP中文网AJAX开发手册栏目中学习）

常用方法：
Open 创建一个新的http请求，并指定此请求的方法、URL以及验证信息
Send 发送请求到http服务器并接收回应 如果请求为get不会发送任何数据
setRequestHeader 单独指定请求的某个http头
AJAX工作流程:
1 对象初始化

function   createXmlHttpRequest(){
   var xmlHttp;
   try{    //Firefox, Opera 8.0+, Safari
           xmlHttp=new XMLHttpRequest();
    }catch (e){
           try{    //Internet Explorer
                  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
            }catch (e){
                  try{
                   xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
                  }catch (e){}  
           }
    }
   return xmlHttp;
 }

2 发送请求
调用XMLHttpRequest对象的open和send方法，按照顺序，open调用完毕之后才调用send方法。

xmlHttp.open("get","../servlet/RegisterServlet?timeStamp="+new Date().getTime(),true)
xmlHttp.send(null);

send的参数如果是以Post方式发出的话，可以是任何想传给服务器的内容，但必须先调用setRequestHeader方法，修改MIME类别：
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
3 服务器接收处理数据并返回，指定事件处理程序处理返回信息
每次 readyState 属性的改变都会触发 readystatechange 事件只要将相应的处理函数名称赋给XMLHttpRequest对象的onreadystatechange属性就可以了

 xmlHttp.onreadystatechange = function(){            if (xmlHttp.readystate == 4) { 
  if (xmlHttp.status == 200 || xmlHttp.status == 304) {//XMLHttpRequest对成功返回的信息有两种处理方式：//responseText：
  将传回的信息当字符串使用；//responseXML：将传回的信息当XML文档使用，可以用DOM处理。 
        }            }        };

4 客户端接收
5 修改客户端页面内容

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

以上就是AJAX的工作流程有哪些？ajax的工作流程介绍（附实例）的详细内容，更多请关注Gxl网其它相关文章！

内容总结

以上是互联网集市为您收集整理的AJAX的工作流程有哪些？ajax的工作流程介绍（附实例）全部内容，希望文章能够帮你解决AJAX的工作流程有哪些？ajax的工作流程介绍（附实例）所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

---