第3章 与服务器通信：发送请求和处理响应.ppt

前面的例子对于服务器发送的XML 响应并没有做多少有用的事情。在警告框中显示XML 文档的值没有太大的实际意义。你真正想做到的是让用户享有丰富的客户体验，不再遭遇一般Web应用中常见的连续页面刷新问题。页面连续刷新不仅使用户不满意，还会浪费服务器上宝贵的处理器时间，因为页面刷新需要重新构建整个页面的内容，而且会不必要地使用网络带宽来传送刷新的页面。 以往，在Web浏览器的限制之下，这一点很难做到。浏览器只是一个工具，它解释特殊的标记（HTML），并根据一组预定的规则显示这些标记。Web以及Web浏览器原来只是为了显示静态的信息，如果不以新页面的形式从服务器请求新的数据，这些信息不会改变。 * *   Ajax基础教程 Ryan Asleson Nathaniel T.Schutta 著 金灵等 译 人民邮电出版社 第3章与服务器通信：发送请求和处理响应 * * 上一章我们学习了如何创建XMLHttpRequest对象，本章将学习如何使用XMLHttpRequest对象向服务器发送请求，以及怎样用javascript处理服务器响应。 * * 3.1 处理服务器响应 XMLHttpRequest对象提供了两个可以用来访问服务器响应的属性。第一个属性responseText将响应提供为一个串，第二个属性responseXML将响应提供为一个XML对象。一些简单的用例就很适合按简单文本来获取响应，如将响应显示在警告框中，或者响应只是指示成功还是失败的词。 第2章中的例子就使用了responseText属性来访问服务器响应，并将响应显示在警告框中。 * * 3.1.1 使用innerHTML属性创建动态内容 结合使用HTML元素的innerHTML属性，responseText属性就会变得非常有用。 innerHTML属性是一个非标准的属性，最早在IE中实现，后来也为其他许多流行的浏览器所采用。这是一个简单的串，表示一组开始标记和结束标记之间的内容。 通过结合使用responseText和innerHTML，服务器就能“生产”或生成HTML内容 实例：点击search（有哪些信誉好的足球投注网站）按钮将在服务器上启动“有哪些信誉好的足球投注网站”，服务器将生成一个结果表作为响应。代码清单3-1 * * 3.1.1 使用innerHTML属性创建动态内容 点击search按钮，调用startRequest函数，它先调用createXMLHttpRequest函数来初始化XMLHttpRequest对象的一个新实例； startRequest函数将回调函数设置为handleStateChange函数； startRequest函数使用open()方法来设置请求方法（GET）及请求目标，并且设置为异步地完成请求； 使用XMLHttpRequest对象的send()方法发送请求； XMLHttpRequest对象的内部状态每次有变化时，都会调用handleStateChange函数。一旦接收到响应（如果readyState属性的值为4），div元素的innerHTML属性就将使用XMLHttpRequest对象的responseText属性设置。 * * 3.1.2 将响应解析为XML 前面的例子中，服务器的响应只是简单的文本，这种方式的灵活性不佳。 服务器也可以将响应作为XML发送，这可以发送大量的、复杂的、结构化的数据。 通过设置响应头Content-Type的值，如果为“text/plain”，响应将作为简单文本发送；如果设为“ text/xml”，响应将作为XML发送。 对于XML文档的处理，浏览器通过DOM提供了很好的支持。 * * 3.1.2 将响应解析为XML W3C DOM和JavaScript W3C DOM和JavaScript很容易混淆不清。DOM是面向HTML和XML文档的API，为文档提供了结构化表示，并定义了如何通过脚本来访问文档结构。JavaScript则是用于访问和处理DOM的语言。如果没有DOM，JavaScript根本没有Web页面和构成页面元素的概念。文档中的每个元素都是DOM的一部分，这就使得JavaScript可以访问元素的属性和方法。 DOM独立于具体的编程语言，通常通过JavaScript访问DOM，不过并不严格要求这样。可以使用任何脚本语言来访问DOM，这要归功于其一致的API。表3-1列出了DOM元素的一些有用的属性，表3-2列出了一些有用的方法。 有了W3C DOM，就能编写简单的跨浏览器脚本，从而充分利用XML的强大功能和灵活性，将XML作为浏览器和服务器之间的通信介质。 * * 3.1.2 将响应解析为XML 表3-1 用于处理XML文档的DOM元素属性 表3-2