XML技术及应用古凌岚电子教案 第8章_XML结合JavaScript的应用.ppt

 XML技术及应用第八章 XML结合JavaScript的应用  知识要点 数据岛 XML数据的嵌入与读取 结合JavaScript脚本的应用 8.1 XML数据岛的应用 XML数据的嵌入和读取 数据岛：是一个XML标签元素，该元素含一个ID属性，用于指定该数据岛的名称，元素中的内容即为XML代码。 将XML数据嵌入HTML：内嵌方式和外部引用方式。 内嵌方式 例如： XML?ID=musicXMLID??? ?music???????title春天/title publisher天籁之声音像公司/publisher??? /music? /XML? 8.1 XML数据岛的应用 XML数据的嵌入和读取 外部引用方式 ：在XML标签中通过SRC属性引用，该属性既可以引用本地的文件，也可以指定一个URL 例1，SRC属性引用本地的XML文件： XML? ID=musicXMLID? SRC=music.xml/XML 例2，引用一个远程服务器上的XML文件：XML ID=xmlData SRC=/exam/xmlData.xml/XML 8.1 XML数据岛的应用 XML数据的嵌入和读取 获取HTML中数据岛的内容 采用数据绑定的方法，将数据控件（数据岛）与HTML元素建立起一种联系，数据控件负责管理数据，并为HTML元素提供数据，而HTML元素则负责在浏览器上显示数据 数据绑定的实现需要设置两个属性： DATASRC——指定要绑定的数据源，并要求数据源名要加“#”前缀； DATAFLD——指定绑定数据控件的具体字段，字段是指数据控件所管理数据中的列，也可以理解为数据库表中的列。 8.1 XML数据岛的应用 实例：在网页定制XML格式图书信息的显示方式 问题 书店管理系统中网上图书浏览功能，要求按照指定的样式显示图书详细信息，图书详细信息存放在BOOKLIB_1.xml文件，指定格式要求： （1）显示图书的ISBN、书名、作者、价格以及出版社 （2）表格显示，要求有标题 （3）表格底色为淡红色 8.1 XML数据岛的应用 8.1 XML数据岛的应用 分析 确定图书信息显示的机制 图书信息显示 完整代码 8.1 XML数据岛的应用 解决 确定图书信息显示的机制 将XML数据岛嵌入HTML页面，即显示内容以XML文档数据为原始依据，表现形式使用HTML元素来实现。 8.1 XML数据岛的应用 图书信息显示 采用外部引用方式，嵌入图书信息XML数据岛的语句为： XML ID=xmlBooks src=BOOKLIB.xml / 采用HTML表格显示数据 8.1 XML数据岛的应用 完整代码（略） 8.1 XML数据岛的应用 单元练习 酒店管理系统要求在网上，客户可以浏览酒店所有房间的信息，以便订房。请按指定格式显示客房信息。格式要求： （1）显示房间的类型、房价、位置 （2）表格显示 8.2 结合JavaScript的应用 DataPageSize属性 TABLE元素的DataPageSize属性也是HTML对数据岛的支持属性，指定每页记录条数 transformNode方法 若XML数据显示需要设置显示格式，可通过以下几步实现： 创建XSLT 引用XML，引用XSLT 利用XSLT对数据岛中的数据进行转换，通过HTML元素可输出指定的表现形式 8.2 结合JavaScript的应用 transformNode方法 第三步中对数据岛的数据转换，可采用DOMDocument类的transformNode()方法 实现方式： musicXML.transformNode(musicXSLT. XMLDocument); 说明：其中musicXML、musicXSLT分别为数据岛、XSLT的ID。 8.2 结合JavaScript的应用 实例：控制图书信息显示方式 问题 书店管理系统中，网上浏览图书信息的方式可以根据客户需要，变换显示方式为列表或表格。 8.2 结合JavaScript的应用 8.2 结合JavaScript的应用 分析 创建表格和列表的XSLT 引用数据岛，XSLT 创建脚本，实现XSLT对数据岛的数据转换 8.2 结合JavaScript的应用 解决 创建表格和列表的XSLT 表格XSLT文件bookTable.xsl ?xml version=1.0 encoding=GB2312? xsl:stylesheet version=1.0 xmlns:xsl=/1999/XSL/Transform xsl:template match=/ table border=2 bgcolor=p