学IT网-在线学习IT知识

 找回密码
 立即注册

QQ登录

只需一步,快速开始

搜索
热搜: html css js php
查看: 450|回复: 0

AJAX XML

[复制链接]

1380

主题

1382

帖子

1万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
11316
发表于 2017-7-31 20:26:42 | 显示全部楼层 |阅读模式
AJAX XML 实例
AJAX 可用来与 XML 文件进行交互式通信。

AJAX XML 实例
下面的例子将演示网页如何使用 AJAX 来读取来自 XML 文件的信息:
实例
  1. Get CD info
复制代码



尝试一下 »



实例解析 - loadXMLDoc() 函数
当用户点击上面的"获得 CD 信息"这个按钮,就会执行 loadXMLDoc() 函数。
loadXMLDoc() 函数创建 XMLHttpRequest 对象,添加当服务器响应就绪时执行的函数,并将请求发送到服务器。
当服务器响应就绪时,会构建一个 HTML 表格,从 XML 文件中提取节点(元素),最后使用已经填充了 XML 数据的 HTML 表格来更新 txtCDInfo 占位符:
  1. function loadXMLDoc(url)
  2. {
  3. var xmlhttp;
  4. var txt,xx,x,i;
  5. if (window.XMLHttpRequest)
  6.    {// code for IE7+, Firefox, Chrome, Opera, Safari
  7.    xmlhttp=new XMLHttpRequest();
  8.    }
  9. else
  10.    {// code for IE6, IE5
  11.    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  12.    }
  13. xmlhttp.onreadystatechange=function()
  14.    {
  15.    if (xmlhttp.readyState==4 && xmlhttp.status==200)
  16.      {
  17.      txt="<table border='1'><tr><th>Title</th><th>Artist</th></tr>";
  18.      x=xmlhttp.responseXML.documentElement.getElementsByTagName("CD");
  19.      for (i=0;i<x.length;i++)
  20.        {
  21.        txt=txt + "<tr>";
  22.        xx=x[i].getElementsByTagName("TITLE");
  23.          {
  24.          try
  25.            {
  26.            txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
  27.            }
  28.          catch (er)
  29.            {
  30.            txt=txt + "<td> </td>";
  31.            }
  32.          }
  33.      xx=x[i].getElementsByTagName("ARTIST");
  34.        {
  35.          try
  36.            {
  37.            txt=txt + "<td>" + xx[0].firstChild.nodeValue + "</td>";
  38.            }
  39.          catch (er)
  40.            {
  41.            txt=txt + "<td> </td>";
  42.            }
  43.          }
  44.        txt=txt + "</tr>";
  45.        }
  46.      txt=txt + "</table>";
  47.      document.getElementById('txtCDInfo').innerHTML=txt;
  48.      }
  49.    }
  50. xmlhttp.open("GET",url,true);
  51. xmlhttp.send();
  52. }
复制代码


AJAX 服务器页面
上面这个例子中使用的服务器页面实际上是一个名为 "cd_catalog.xml" XML 文件。

上一篇:  AJAX 实例 下一篇:  AJAX 数据库
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|Archiver|小黑屋|学IT网-在线学习IT知识,学习编程知识 ( 京ICP备17027470号-2

GMT+8, 2019-11-15 15:23 , Processed in 0.031340 second(s), 34 queries .

Powered by xueit.wang 1.0

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表