AJAX ResponseXML

转载 2007年09月21日 14:58:00

AJAX ResponseXML


作者:w3pop.com 翻译/整理:w3pop.com 发布:2007-08-24 浏览:549 :: ::
While responseText returns the HTTP response as a string, responseXML returns the response as XML.
“responseText”属性以字符串形式返回HTTP响应;“responseXML”属性以XML形式返回HTTP响应。

The ResponseXML property returns an XML document object, which can be examined and parsed using W3C DOM node tree methods and properties.
“responseXML”属性返回了一份XML文档对象,可以使用W3C DOM节点树方法和属性对该XML文档对象进行检查和解析。


AJAX ResponseXML Example
AJAX ResponseXML 案例

In the following AJAX example we will demonstrate how a web page can fetch information from a database using AJAX technology. The selected data from the database will this time be converted to an XML document, and then we will use the DOM to extract the values to be displayed.
在下述AJAX案例中,我们将具体说明一张网页是如何使用AJAX技术从数据库中获取信息的;从数据库中选择的数据将被即时转换成一份XML文档,并且,我们将使用DOM分离出需要显示的值。


Select a Name in the Box Below
在下面的文本框中选择一个名称

Select a Customer:

AJAX Example Explained
AJAX 案例剖析

The example above contains an HTML form, several <span> elements to hold the returned data, and a link to a JavaScript:
上述案例包含了一份HTML表单,部分<span>元素保留了所返回的数据以及一个指向JavaScript的链接:

<html>
<head>
<script src="selectcustomer_xml.js"></script>
</head>
<body>
<form action=""> 
Select a Customer:

<select name="customers" onchange="showCustomer(this.value)">
<option value="ALFKI">Alfreds Futterkiste</option>
<option value="NORTS ">North/South</option>
<option value="WOLZA">Wolski Zajazd</option>

</select>
</form>
<b><span id="companyname"></span></b><br />
<span id="contactname"></span><br />

<span id="address"></span>
<span id="city"></span><br/>
<span id="country"></span>
</body>
</html>

The example above contains an HTML form with a drop down box called "customers".
上述案例列举了一份包含名为“customers [客户]”下拉菜单框的HTML表单。

When the user selects a customer in the dropdown box, a function called "showCustomer()" is executed. The execution of the function is triggered by the "onchange" event. In other words: Each time the user change the value in the drop down box, the function showCustomer() is called.
当用户在下拉菜单框中选择一个客户时,将执行“showCustomer()”函数。该函数的执行是由“onchange”事件激发的;换句话说:每当用户改变下拉菜单框中的值的时候,函数“showCustomer()”将被执行。

The JavaScript code is listed below.
具体的JavaScript代码将在下面列出。


The AJAX JavaScript
AJAX JavaScript 脚本

This is the JavaScript code stored in the file "selectcustomer_xml.js":
下面列举了储存在“selectcustomer_xml.js”文件中的JavaScript代码:

var xmlHttp
function showCustomer(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null)
{
alert ("Your browser does not support AJAX!");
return;
}
var url="getcustomer_xml.asp";
url=url+"?q="+str;
url=url+"&sid="+Math.random();
xmlHttp.onreadystatechange=stateChanged;
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function stateChanged() 
{
if (xmlHttp.readyState==4)
{
var xmlDoc=xmlHttp.responseXML.documentElement;
document.getElementById("companyname").innerHTML=
xmlDoc.getElementsByTagName("compname")[0].childNodes[0].nodeValue;
document.getElementById("contactname").innerHTML=
xmlDoc.getElementsByTagName("contname")[0].childNodes[0].nodeValue;
document.getElementById("address").innerHTML=
xmlDoc.getElementsByTagName("address")[0].childNodes[0].nodeValue;
document.getElementById("city").innerHTML=
xmlDoc.getElementsByTagName("city")[0].childNodes[0].nodeValue;
document.getElementById("country").innerHTML=
xmlDoc.getElementsByTagName("country")[0].childNodes[0].nodeValue;
}
}

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

The showCustomer() and GetXmlHttpObject() functions above are the same as in previous chapters. The stateChanged() function is also used earlier in this tutorial, however; this time we return the result as an XML document (with responseXML) and uses the DOM to extract the values we want to be displayed.
上述的“showCustomer()”函数和“GetXmlHttpObject()”函数与上一章我们提到过的相同。在这份教程的前面部分中,我们还使用了“stateChanged()”函数。然而,这次我们使用“responseXML”属性返回了一份XML文档,并且,我们将使用DOM分离出需要显示的值。


The AJAX Server Page
AJAX 服务器页面

The server page called by the JavaScript, is a simple ASP file called "getcustomer_xml.asp".
这份被JavaScript请求的服务器页面是一份名为“getcustomer_xml.asp”的简单ASP文件。

The page is written in VBScript for an Internet Information Server (IIS). It could easily be rewritten in PHP, or some other server language. Look at a corresponding example in PHP.
该页面是由VBScript书写的,并且支持网络信息服务器(iis)。使用PHP或其它程序语言也可以非常方便地对它进行重写。请看相应的PHP案例

The code runs an SQL query against a database and returns the result as an XML document:
下面的代码运行了用于查询数据库数据的SQL查询语句并且返回了一份XML文档:

<%
response.expires=-1
response.contenttype="text/xml"
sql="SELECT * FROM CUSTOMERS "
sql=sql & " WHERE CUSTOMERID='" & request.querystring("q") & "'"

on error resume next
set conn=Server.CreateObject("ADODB.Connection")
conn.Provider="Microsoft.Jet.OLEDB.4.0"
conn.Open(Server.Mappath("/db/northwind.mdb"))
set rs=Server.CreateObject("ADODB.recordset")
rs.Open sql, conn
if err <> 0 then
response.write(err.description)
set rs=nothing
set conn=nothing
else
response.write("<?xml version='1.0' encoding='ISO-8859-1'?>")
response.write("<company>")
response.write("<compname>" &rs.fields("companyname")& "</compname>")
response.write("<contname>" &rs.fields("contactname")& "</contname>")
response.write("<address>" &rs.fields("address")& "</address>")
response.write("<city>" &rs.fields("city")& "</city>")
response.write("<country>" &rs.fields("country")& "</country>")
response.write("</company>")
end if
on error goto 0
%>

Notice the second line in the ASP code above: response.contenttype="text/xml". The ContentType property sets the HTTP content type for the response object. The default value for this property is "text/html". This time we want the content type to be XML.
请注意上述ASP代码的第二行:response.contenttype="text/xml"。“ContentType [内容类型]”属性为“response”属性设置了HTTP内容类型。该属性的默认值为“text/html”。这一次,我们希望将它设置成XML。

Then we select data from the database, and builds an XML document with the data.
然后,我们将从数据库中选择数据,并且创建一份包含具体数据的XML文档。

 

AJAX responseXML 实例着重点的说明

由于是一只菜鸟,在此我想借W3school文档中AJAX的一个demo来说明一下AJAX ,Database 转XML中该注意的一些细节问题。在此我还得强调一下AJAX工作原理的重要性,至于AJAX的...
  • tashanhongye
  • tashanhongye
  • 2015年10月21日 20:01
  • 322

AJAX操作02_responseText和responseXML

一AJAX简介 1什么是AJAX AJAX : 异步 JavaScript and XML 通俗的讲,AJAX就是JS通过一个网址去加载数据,这个过程通常是用户不可见的。 传统的网页(不使用 ...
  • weixin_36185028
  • weixin_36185028
  • 2016年12月30日 00:57
  • 474

ajax中responseText与responseXML区别

1、"responseText”属性以字符串形式返回HTTP响应;“responseXML”属性以XML形式返回HTTP响应。      var message = xmlHttp.response...
  • sinat_36146776
  • sinat_36146776
  • 2016年11月17日 11:34
  • 207

ajax中调用responseXML总返回null而调用responseText却返回不为空的解决方法

在创建ajax的时候,要将 request = new XMLHttpRequest(); request.overrideMimeType("text/xml");...
  • yanlintao1
  • yanlintao1
  • 2014年07月19日 01:00
  • 1603

Ajax 获取 responseXML 形式的响应数据(三)

在上一章中,简单介绍了Ajax如何获得responseText字符串形式的响应数据,但在web开发中,很多情况下还需要获得responseXML形式的响应数据。通过一个小例子来看具体代码,如下图:1....
  • LiGuangLiang_bzu
  • LiGuangLiang_bzu
  • 2015年11月01日 21:06
  • 468

Ajax返回responseXML乱码问题

这个问题正解如下:页面设置编码: servlet: response.setContentType("text/xml;charset=gbk");      PrintWriter out = re...
  • tanyun1111
  • tanyun1111
  • 2006年12月21日 18:35
  • 675

Ajax请求Servlet返回文本 json html和XML数据并解析xml及responseText和responseXML的区别

使用ajax请求时候,responseText决定响应的数据类型是文本,responseXML决定响应的数据类型xml文档。当返回xml文档时候Servlet一定要设置response.setCont...
  • liangwenmail
  • liangwenmail
  • 2016年07月21日 21:59
  • 7667

AJAX ResponseXML 实例

原文地址:http://www.w3school.com.cn/ajax/ajax_responsexml.asp 与 responseText 以字符串返回 HTTP 响应不同,responseXM...
  • qiume
  • qiume
  • 2009年02月25日 15:04
  • 789

利用getElementsByTagName解析 responseXML 返回的值

以下程序在IE6和Firefox/3.1b1 下测试通过在Ajax返回的responseXML中,需要对其进行解析,而IE6和Firefox是有点小区别的以下附上完整代码再解释。XML文件:xml v...
  • bfcady
  • bfcady
  • 2008年11月11日 11:50
  • 4333

ajax的responseXML与responseText

  responseXML返回的是xml dom对象,通过该对象可以访问xml文件的节点、属性节点、值节点。  responseText返回的是文本字符串,可以直接打印输出。Servlet: resp...
  • byhsing
  • byhsing
  • 2011年05月31日 11:39
  • 290
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章: AJAX ResponseXML
举报原因:
原因补充:

(最多只允许输入30个字)