首先�Q�AJAX 是个��C��物吗�Q?

�q��如此�?em>�q�程 Javascript 在最�q�掀起了一轮热潮。利用它�Q�开发�h员能够��?XML 数据与服务器交互。�?AJAX ��是一�U�远�E?Javascript。AJAX 之所以成为可能，是因为现在许多主要的��览器都提供可进行独�?XML HTTP ��h��?em>对象。Internet Explorer 5 以及更高版本提供了一�?XMLHTTP 对象�Q�而基�?Mozilla 的浏览器则提供了一�?XMLHttpRequest 对象。这些对象都能够从服务器��h�� XML 数据�Q��ƈ以类似的方式处理�q�些数据。所有能够动态提�?XML 的技术都可以使用服务器端 AJAX �l��g。�Q何动�?Web 技术（�?PHP �?Servlet�Q�都可以充当 AJAX 服务器�?

�q�程 Javascript �?AJAX 的缺点之一是，��面作�?/em>�Q�设计最�l�页面的人员�Q�必��ȝ��写相当数量的 Javascript 代码来管�?XMLHTTP 交互。幸好，JavaServer Faces (JSF) 为此提供了一个解��x��案，从而�� AJAX 更加易于使用�?

Ajax Under The Hood

只有了解�?AJAX 客户�?服务器事务中涉及的核�?AJAX 体系�l�构后，方可�q�一步理解与其他技术（�?JSF�Q�集成的更�ؓ高��?AJAX �C�Z��?

AJAX 目前可以提供以下两种核心技术：

支持 Javascript 和支�?XMLHTTP �?XMLHttpRequest 对象的浏览器
能够�?XML 响应�?HTTP 服务器技�?

因�ؓ所有流行的��览器都支持 Javascript 和必要的 XMLHTTP ��h��对象�Q�且几乎所�?Web 服务器技术均可生�?XML�Q�或��M��标记�Q�，所以核�?AJAX 技术普遍适用�?
最��单的 AJAX 应用�E�序实质上就是一个带�?Javascript 函数的标�?HTML 用户界面�Q�该界面可与能动态生�?XML �?HTTP 服务器进行交互。�Q何动�?Web 技术（�?CGI �?Servlet�Q�以及本文稍后将谈到�?JSF�Q�都可充当服务器�?AJAX 技术�?

核心 AJAX 应用�E�序的主要组件包括：

HTML ��面�Q�其中包含：

�?AJAX Javascript 函数交互�?UI 元素
�?AJAX 服务器交互的 Javascript 函数

可处�?HTTP ��h��q�以 XML 标记响应的服务器�?Web 技术�?

�q�些元素如图 1 所�C��?/p>

�?1 核心 AJAX 体系�l�构

了解了关键元素后�Q�我们就可以设计一个包含输入域、按钮或��M��可链接至 Javascript 的元素的 HTML 用户界面了。例如，按下按钮可激�z�L��?Javascript 函数�Q�或者更深入些，在用户向输入域键入内�Ҏ��可激�z�L��?Javascript 函数。�ؓ此，您可以将 onkeyup= 赋予 Javascript 函数的值来处理输入域中的数据。例如，当发�?onkeyup 事�g�Q�即键入内容�Q�时�Q�输入域“searchField”��调�?Javascript 函数 lookup( )�?

除了响应用户界面交互�Q�例如键入）外，AJAX Javascript 函数�q�可�Ҏ��自己的计时器�q�行独立操作。（可以使用该方法执�?AJAX autosave�Q�自动保存）�Ҏ��。）

如何发出 XML HTTP ��h��

现在�Q�我们来了解如何调用 AJAX Javascript 代码。请看以�?Javascript 代码�Q�该代码可发��Z��?XML HTTP ��h��Q?

if (window.XMLHttpRequest) { req = new XMLHttpRequest(); } else if (window.ActiveXObject) { req = new ActiveXObject("Microsoft.XMLHTTP"); }

利用该代码断�Q�主要的��览器（Internet Explorer �?Mozilla/Safari�Q�都可向服务器发出独立的 HTTP ��h��。该代码首先��查浏览器是否支持上文提及的两个支持的 XMLHTTP 对象�Q�然后对其中之一�q�行实例化�?

一旦对 XMLHttpRequest�Q�或 Microsoft �?XMLHTTP�Q�进行了实例化，卛_��以通过完全相同的方式对其进行操作�?

要初始化到服务器的连接，需使用以下 open �Ҏ��Q?

req.open("GET", url, true);

�W�一个参数是 HTTP �Ҏ��Q?tt>GET �?POST�Q�。第二个参数是服务器�Q�或使用 POST 的表单操作）�?URL�Q�第三个参数�?true�Q�则表明可进行异步调用（“A”代表 AJAX�Q�。这意味着该浏览器可以在实现请求的同时�l�箋执行其他操作�?tt>open �Ҏ��中若�?false ��|��则表明�ؓ非异步处理或��序处理。我们不��如此�Q�这是因为您的浏览器会在�q�回响应前停止操作�?

使用 open 初始化连接后�Q�可�q�行 onreadystatechange 调用�Q�只适用于异步调用）。这��注册一个回调函敎ͼ�一旦请求完成就会调用该函数�Q?

req.onreadystatechange = processXMLResponse;

在完成请求后�Q�将调用处理 XML 响应�?processXMLResponse( ) 函数。可以通过 onreadystatechange 语句以内联方式声明回调函敎ͼ�

req.onreadystatechange = processXMLResponse() { // process request };

�q�可使用 req.setRequestHeader 指定��M��标题内容�Q�如�Q?

req.setRequestHeader("Cookie", "someKey=true");

一旦完全初始化�?XMLHTTP ��h��对象 (req)�Q�就可��?send( ) 初始化对服务器的调用�Q?

req.send(null);

对于 GET ��h��Q��?null 值或�I�字�W�串“”�?

POST ��h��包含一个带有表单数据的字符串参数。它们也要求在请求的标题中设�|?Content-Type。以下两行演�C�Z��如何执行 AJAX POST ��h��Q?

req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded"; req.send("name=scott&email=stiger@foocorp.com");

完成��h��后调用的回调函数通常��h��保��h��不会发生错误的代码。这可通过��?readyState 以及 HTTP ��h��的整�?tt>状�?/tt>来实现。（readystate �?4 表示 XMLHTTP ��h��完整�Q��?200 表示��h��成功�Q?04 含义正好相反�Q��?

function processXMLResponse() { if (req.readyState == 4) { if (request.status != 200) { // Process the XML response } } }

XML 响应的处理是通过使用标准 Javascript DOM �Ҏ��完成的。例如，要从输入�?XML ��中抽取员工姓名�Q?

Chris

您可以��用以下代码：

var name = req.responseXML.getElementsByTagName("employee")[0];

分析更�ؓ复杂�?XML 会��用如下代码�P代元素：

for (i=0;i
�l�合使用 XMLHttpRequest �?HTML

��h��意，通过 XMLHttpRequest 获得 XML 响应无需��L��格式良好和有效。因此，AJAX 服务器端�l��g可以直接��?HTML 内容发送至客户端。然后，JavaScript 可��?req.responseText �Ҏ��/属性（它只是将内容作�ؓ字符串进行检索）��索该 HTML 内容。可以��用该 HTML 字符串文本以��M��方式更改��面。例如，对于以下 HTML ��：

Hello there!

This is HTML

可��用以下语句检索至一个字�W�串中：

var HTMLcontent = req.responseText;

之后通过 id="div1" ��d��x��定的 HTML DIV�?/p>
document.getElementById("div1").innerHTML += HTMLcontent;

JSF 如何支持 AJAX

JSF 及其以组件�ؓ中心的体�pȝ��构通过允许 JSF �l��g全权处理 Javascript 和嵌入式 AJAX“��g”解决�?AJAX 的固有难题。JSF ��面作者甚��x��需��x��客户端与服务器之间的 AJAX 交互。它们只需像��用其�?JSF �l��g那样使用支持 AJAX �?JSF �l��g卛_��Q�而且感觉更好。JSF �?AJAX 的结合��用前途光明！

保持��x��Q?/p>

和田�?/a> 2007-07-02 19:55 发表评论

国产一区二区日韩,国产午夜一区二区三区,蜜桃一区二区

首先�Q�AJAX 是个��C��物吗�Q?

Ajax Under The Hood

如何发出 XML HTTP ��h��

�l�合使用 XMLHttpRequest �?HTML

Hello there!

JSF 如何支持 AJAX