XML 应用程序
来源:互联网 发布:lightapp.js 编辑:程序博客网 时间:2024/05/24 00:59
XML 应用程序
本章演示一些基于 XML, HTML, XML DOM 和 JavaScript 构建的小型 XML 应用程序。
XML 文档实例
在本应用程序中,我们将使用 "cd_catalog.xml" 文件。
在 HTML div 元素中显示第一个 CD
下面的实例从第一个 CD 元素中获取 XML 数据,然后在 id="showCD" 的 HTML 元素中显示数据。displayCD() 函数在页面加载时调用:
实例
x=xmlDoc.getElementsByTagName("CD");
i=0;
function displayCD()
{
artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt="Artist: " + artist + "<br />Title: " + title + "<br />Year: "+ year;
document.getElementById("showCD").innerHTML=txt;
}
i=0;
function displayCD()
{
artist=(x[i].getElementsByTagName("ARTIST")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
txt="Artist: " + artist + "<br />Title: " + title + "<br />Year: "+ year;
document.getElementById("showCD").innerHTML=txt;
}
尝试一下 »
添加导航脚本
为了向上面的实例添加导航(功能),需要创建 next() 和 previous() 两个函数:
实例
function next()
{ // display the next CD, unless you are on the last CD
if (i<x.length-1)
{
i++;
displayCD();
}
}
function previous()
{ // displays the previous CD, unless you are on the first CD
if (i>0)
{
i--;
displayCD();
}
}
{ // display the next CD, unless you are on the last CD
if (i<x.length-1)
{
i++;
displayCD();
}
}
function previous()
{ // displays the previous CD, unless you are on the first CD
if (i>0)
{
i--;
displayCD();
}
}
尝试一下 »
当点击 CD 时显示专辑信息
最后的实例展示如何在用户点击某个 CD 项目时显示专辑信息:
尝试一下。
如需了解更多关于使用 JavaScript 和 XML DOM 的信息,请访问我们的 XML DOM 教程。
0 0
- XML 应用程序
- XML 应用程序
- XML 应用程序
- XML应用程序开发--上
- 应用程序写Xml文档
- XML和现代CGI应用程序
- 应用程序部署文件Web.xml
- XML和现代CGI应用程序
- XML和现代CGI应用程序
- 创建应用程序的XML文件
- ant-build.xml打包应用程序
- 测试XML Web 服务和应用程序
- XML 如何推动下一代信息共享应用程序
- tomcat自动加载应用程序的web.xml
- javascript读取xml实现应用程序菜单效果
- 应用程序——INI和XML配置文件
- 2.3 AndroidMainfest.xml与应用程序功能组件
- 应用程序——INI和XML配置文件
- 使用 XSLT 显示 XML
- XMLHttpRequest 对象
- XML Parser
- XML DOM
- HTML 页面显示 XML 数据
- XML 应用程序
- Mybatis-基础搭建步骤/实例
- XML 命名空间
- XML CDATA
- XML 编码
- BubbleSort
- linux根文件系统 /etc/resolv.conf 文件详解
- iOS中使用RSA对数据进行加密解密
- 关于Android的消息弹窗