AJAX教程(11)：AJAX XML 实例- Javascript - 软晨网（RuanChen.com）

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > AJAX教程(11)：AJAX XML 实例

Javascript: javascript 汉字与拼音转换; JavaScript使用cookie; 大平洋汽车网左侧菜单; 使用JS操作页面表格，元素的一些技巧; 分享我学习js的过程作者aircy javascript学习教程; 张孝祥JavaScript学习阶段性总结(2)--(X)HTML学习; 用js来生成随机彩票号码清单; 发一个数据过滤的代码，很简单，有用的着的拿去; 如何在标题栏显示框架内页面的标题; js滚动条多种样式,推荐; 再次更新！MSClass (Class Of Marquee Scroll通用不间断滚动JS封装类 Ver 1.6); 符合web标准的连续滚动图像的js代码; 使用iframe作为日历的载体，不再被select和flash等控件挡住的日期输入框; 通过脚本控制指定内容不能被选择; 模拟弹出窗口效果，关闭层之前，不能选择后面的页内容; 另类弹出窗口,跳过所有拦截工具; 使用prototype.js进行异步操作; JS模拟多线程; 动态增加/删除文件域; [分享]一个非常漂亮的进度滚动条

No. « ‹ 47 48 49 50 › »

技术文章搜索

关键字

Javascript 中的 AJAX教程(11)：AJAX XML 实例

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-28 浏览: 211 ::

收藏到网摘: n/a

AJAX教程(10)：AJAX 数据库实例 AJAX教程(12)：AJAX ResponseXML 实例

AJAX 可用来与 XML 文件进行交互式通信。

AJAX XML 实例

在下面的 AJAX 实例中，我们将演示如何通过使用 AJAX 技术，从 XML 文件中读取信息。

在下面的下列列表中选择一个 CD

在此列出 CD 信息。

AJAX 实例解释

上面的例子包含了一个简单的 HTML 表单，以及指向一段 JavaScript 的链接：

<html>
<head>
<script src="selectcd.js"></script>
</head>
<body>
<form>
选择 CD：
<select name="cds" onchange="showCD(this.value)">
<option value="Bob Dylan">Bob Dylan</option>
<option value="Bonnie Tyler">Bonnie Tyler</option>
<option value="Dolly Parton">Dolly Parton</option>
</select>
</form>
<p>
<div id="txtHint"><em>在此列出 CD 信息。</em></div>
</p>
</body>
</html>

正如您所看到的，它只是一个带有名为 "cds" 的下拉列表的简单 HTML 表单。

表单下面的段落包含一个名为 "txtHint" 的 div。该 div 用作从 web 服务器接受的数据的位置占位符。

当用户选择列表时，名为 "showCD" 的函数就会被执行。该函数的执行是 "onchange" 事件触发的。换句话说，每当用户改变了下拉列表的值，这个 showCD 函数就会被调用。

下面列出了 JavaScript 代码。

AJAX JavaScript

这是存储在文件 "selectcd.js" 中的 JavaScript 代码：

var xmlHttp
function showCD(str)
{
xmlHttp=GetXmlHttpObject();
if (xmlHttp==null) { alert ("Your browser does not support AJAX!"); return; }
var url="getcd.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)
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
}
}
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;
}

AJAX 服务器页面

被 JavaScript 调用的服务器页面，是名为 "getcd.asp" 的简单 ASP 文件。

该页面使用 VBScript 编写，针对 Internet 信息服务器 (IIS)。可以用 PHP 或其他服务器语言，简单地重写该页面。

请看在 PHP 中对应的例子（测试：缺具体页面）。

该代码执行针对 XML 文件的查询，并以 HTML 返回结果：

<%
response.expires=-1
q=request.querystring("q")
set xmlDoc=Server.CreateObject("Microsoft.XMLDOM")
xmlDoc.async="false"
xmlDoc.load(Server.MapPath("cd_catalog.xml"))
set nodes=xmlDoc.selectNodes("CATALOG/CD[ARTIST='" & q & "']")
for each x in nodes for each y in x.childnodes response.write("<b>" & y.nodename & ":</b> ") response.write(y.text) response.write("<br />") next
next
%>