XML 和 WebSphere Studio Application Developer - 第 7 部分: 使用 XSL Editor 和 XSL Debugger 开发 XSL 样式表
2005-10-27 10:03
489 查看
引言
IBM® WebSphere® Studio Application Developer 是一种应用程序开发环境,它支持用 JSP、servlet、HTML、XML、Web 服务、数据库和 EJB 等不同的技术构建多种应用程序。Application Developer 还特别提供了 XML 和关系数据之间的紧密集成。凡是 WebSphere Application Server 支持的数据库,Application Developer 都支持,包括 DB2®、Oracle、Sybase 和 Microsoft® SQL Server™。
本文是着重讲述 WebSphere Studio Application Developer 附带的各种 XML 工具的系列文章的第 7 部分。第 7 部分演示如何使用 WebSphere Studio Application Developer 版本 5.0 提供的一些新 XSL 工具来开发 XSL 样式表。
创建一个简单的样式表
我们将从零开始创建一个新的 XSL 样式表。在开始之前,请下载 下面提供的
选择 File =>New =>XSL以启动 New XSL 向导。
在 File name 域中,输入
在 Select XML file 页中,选择您已经导入的
单击 Finish。这样就创建了
创建样式表
XSL Editor 提供了许多向导来帮助您创建样式表中的内容。它还提供了一单击即转换功能,让您很快就能看到转换的结果。在这一部分,我们将向您展示如何用三个简单的步骤创建一个简单的 XSL 样式表并用它把
第 1 步:添加一个 HTML 模板头
为创建 HTML 文档,我们将添加一个模板用来生成 HTML 头信息和定义文档的输出方法。
把光标放到
从菜单中选择 XSL =>HTML Template。这将创建一个
第 2 步:创建一张 HTML 表格
接下来,我们将创建一个将产生 HTML 表格的模板。
把光标放到在上面的第 1 步中生成的
从菜单中选择 XSL =>HTML Table。这会启动如下面图 1 所示的 XSL Table Wizard。
选择 VIDEO元素作为用于构建 HTML 表格的上下文节点。这意味着 VIDEO 元素的所有子元素都将作为表格中的列被添加。
选择 Wrap table in a template复选框指出我们想把这个表格包装到新的模板中。
选择 Include Header复选框指出我们想在这个表格中包含一个表头。
(可选步骤)单击 Next转到下一页,为该表格添加表格边框和背景色。
单击 Finish。这将在
图 1. XSL Table Wizard
第 3 步:保存和转换
选择 File =>Save 保存
从菜单中选择 Debug =>Transform。这将调用 Xalan 处理器来转换与这个 XSL 文件相关联的 XML 文件(
图 2. videos.xml 的简单 HTML 表格
把一个样式表与多个 XML 文档关联起来
当我们创建
图 3. 把多个 XML 文档与一个 XSL 样式表关联起来
使用 Associations 对话框,您可以添加或删除关联,还可以设置缺省关联。如果某个 XML 文件被设置为一个 XSL 文件的缺省关联,那么对 XSL 文件的任何需要知道实例文件的处理(例如,转换、调试或 XPath 向导调用)都将自动使用该缺省关联进行。
将一个 XSL 样式表应用于许多个结构相同但内容有别的 XML 文档是很常见的。您可以使用 Associations 对话框来设置所有关联。当您更改 XSL 样式表时,您只需单击一下鼠标就可以选择 Transform all XMLs[/b] 操作来转换所有已与 XSL 样式表关联在一起的 XML 文件。
图 4. Transform all XMLs
改善录像商店的设计
至此,我已经演示了如何使用 XSL Editor 中的向导来根据 XML 文档快速创建样式表。但对于一个真实的录像商店来说,这个 HTML 表格看起来不是很吸引人。例如,您更愿意看到录像的真实图像吗?一种更吸引人的设计可能如下面的图 5 所示。当您访问该录像商店时,会给您显示一个最受欢迎影片的列表。接着,您可以通过单击链接选择某部特定的影片;这样将会显示一张图像和详细的描述,如下面的图 6 所示。
图 5. 影片列表
图 6. 一部被选中的影片
这样一个 Web 站点可以使用与它的数据源相同的
创建能够处理超链接(
设计并部署将在运行时把 XSL 转换成 HTML 的 Web 应用程序。
在本文余下的几部分中,我们将着重讨论第一项任务。我们将研究可以用来调试 XSL 样式表的 XSL Debugger。在本系列的下一部分,我们将讨论如何构建将把这些样式表应用于输入数据以将输入数据转换成如上面的图 5 和图 6 所示的 HTML 输出的 Web 应用程序。
调试 XSL 样式表
创建一个名为
为了搞清楚
图 7. XSL Debugger
XSL Debugger 具有下列视图:
Sessions 视图显示调试会话列表。您可以从这个视图使用工具栏按钮在当前转换上单步向前
或单步向后
,如果在 XSL 源代码中设置了断点的话可以运行到某个断点
,或者在结果文档上打开浏览器
。
Current XSL Element 视图在您一步步执行转换的过程中显示 XSL 样式表中某个元素的详细信息。Actual Value 列显示该 XSL 元素被求值时的实际值。
Breakpoints 视图显示在 XSL 样式表上所设置的断点的列表。您可以使用这个视图除去断点。
Template Call Stack 视图显示调用堆栈中的模板的列表。当进入某个模板时,将会有一个条目被添加。当模板完成执行时,该条目就被从堆栈中除去。
XSL Debugger 还在一个平铺编辑器中打开输入 XML 和 XSL,以便在您一步步执行转换时把 XML 和 XSL 并排放在一起,这样看起来就很方便。不过,如果您的 XSL 样式表包含其他样式表,或者如果您的样式表转换多个文档,那么平铺编辑器读起来就很困难了,您可能会想简单地把各个编辑器层叠起来。要更改这一点,您可以选择 Windows =>Preference =>XML =>XSL Debugging[/b],然后取消对“Show all debugging files in a tile editor”复选框的选择,如下面的图 8 所示:
图 8. XSL Debugging 首选项
使用 XSL Debugger 研究 movieList.xsl 文件
在 Sessions 视图中,单击
按钮开始一步步执行转换。正被执行的 XSL 规则在 XSL 源代码编辑器中被突出显示。继续单步向前,直到到达下面定义变量
XSL Debugger 在碰到结束标记时对变量进行求值。在这个简单的例子中,该变量在同一行中就结束了,但对于更复杂的变量声明,一个变量的值可能会涉及到调用另一个可能跨越多行的模板。请仔细查看 Current XSL Element 视图,看看
继续单步向前,直到到达下面定义
这个
图 9. 求 href 属性的值
您可以单步遍历
现在,单击
按钮运行到该断点。注意,每次单击鼠标时,Current XSL Element 视图都会显示一个对应于
接下来,我们将使用 XSL Debugger 仔细研究一下
请回想一下,
在 XSL 源代码编辑器中,在下面这一行上设置一个断点,该行根据变量
在 Sessions 视图中,单击
按钮运行到该断点。在 Current XSL Element 视图中,请注意求出的
如果您再次单击
按钮,那么
在 Sessions 视图中,选择当前会话并启动弹出菜单(参见图 10)。选择 Relaunch[/b] 开始一次新转换。单击
按钮在新转换上打开浏览器。您将会看到另一个影片描述。 图 10. 重新启动一个新的调试会话
结束语
本文描述了如何使用 WebSphere Studio Application Developer 版本 5.0 中的一些新的 XSL 工具。这些工具可以帮助初学者很快就可以开始使用 XSL,并且可以帮助 XSL 程序员中的高手提高工作效率。
WebSphere Studio Application Developer 5.0 中本文未描述的其他与 XSL 有关的工具包括:
XSL from XHTML 向导。它根据 XHTML 文件生成 XSL 样式表。如果您想把现有的 HTML 文件迁移到 XSL 和 XML 基础架构中,它还可以把数据转换成 XML 格式(可选)。
Java bean XML/XSL Web client 向导。它接受 Java bean,然后生成一个 DOM、一些可以应用于这个 DOM 的关联的 XSL 样式表和一个能够将这些 XSL 样式表应用于该 DOM(这样您便可以使用 XML 和 XSL 快速创建 Web 应用程序的前端)的 servlet。
支持使用 XSLTC的编译后的 XSL 样式表。
帮助您构建和测试 XPath表达式的 XPath 向导。
在本系列的下一篇文章中,我们将讲述如何开发和部署将使用我们在本文中创建的 XSL 样式表的 Web 应用程序。
下载
IBM® WebSphere® Studio Application Developer 是一种应用程序开发环境,它支持用 JSP、servlet、HTML、XML、Web 服务、数据库和 EJB 等不同的技术构建多种应用程序。Application Developer 还特别提供了 XML 和关系数据之间的紧密集成。凡是 WebSphere Application Server 支持的数据库,Application Developer 都支持,包括 DB2®、Oracle、Sybase 和 Microsoft® SQL Server™。
本文是着重讲述 WebSphere Studio Application Developer 附带的各种 XML 工具的系列文章的第 7 部分。第 7 部分演示如何使用 WebSphere Studio Application Developer 版本 5.0 提供的一些新 XSL 工具来开发 XSL 样式表。
创建一个简单的样式表
我们将从零开始创建一个新的 XSL 样式表。在开始之前,请下载 下面提供的
xslExample1.zip文件。切换到 XML 透视图。创建一个名为
Simple的新项目,然后将
videos.xml文件从
xslExample1.zip文件导入到
Simple项目中。按如下步骤启动 New XSL 文件向导:
选择 File =>New =>XSL以启动 New XSL 向导。
在 File name 域中,输入
videos.xsl。单击 Next。
在 Select XML file 页中,选择您已经导入的
videos.xml文件。这会把
videos.xml文件和
videos.xsl文件 关联起来。
单击 Finish。这样就创建了
videos.xsl文件,并且 XSL Editor 自动为您打开。
创建样式表
XSL Editor 提供了许多向导来帮助您创建样式表中的内容。它还提供了一单击即转换功能,让您很快就能看到转换的结果。在这一部分,我们将向您展示如何用三个简单的步骤创建一个简单的 XSL 样式表并用它把
videos.xml数据格式化成一张 HTML 表格:
第 1 步:添加一个 HTML 模板头
为创建 HTML 文档,我们将添加一个模板用来生成 HTML 头信息和定义文档的输出方法。
把光标放到
videos.xsl文件中
<xsl:stylesheet>元素后面的空行上。
从菜单中选择 XSL =>HTML Template。这将创建一个
<xsl:output>元素(它将以 HTML 格式输出结果)和一个模板(它将用
videos.xml文件中处理所有直接子元素的
<xsl:apply-templates>规则生成 HTML 头)。
第 2 步:创建一张 HTML 表格
接下来,我们将创建一个将产生 HTML 表格的模板。
把光标放到在上面的第 1 步中生成的
</xsl:template>元素后面的空行上。
从菜单中选择 XSL =>HTML Table。这会启动如下面图 1 所示的 XSL Table Wizard。
选择 VIDEO元素作为用于构建 HTML 表格的上下文节点。这意味着 VIDEO 元素的所有子元素都将作为表格中的列被添加。
选择 Wrap table in a template复选框指出我们想把这个表格包装到新的模板中。
选择 Include Header复选框指出我们想在这个表格中包含一个表头。
(可选步骤)单击 Next转到下一页,为该表格添加表格边框和背景色。
单击 Finish。这将在
videos.xsl文件中创建一个将生成 HTML 表格的新 VIDEOS 模板。
图 1. XSL Table Wizard
第 3 步:保存和转换
选择 File =>Save 保存
videos.xsl文件。将对
videos.xsl文件运行 XSL 验证(XSL Validation)。完成后的
videos.xsl文件包含在
xslExample1.zip文件中。
从菜单中选择 Debug =>Transform。这将调用 Xalan 处理器来转换与这个 XSL 文件相关联的 XML 文件(
videos.xml)。所得到的 HTML 文件如下面的图 2 所示。
图 2. videos.xml 的简单 HTML 表格
把一个样式表与多个 XML 文档关联起来
当我们创建
videos.xsl文件时,我们把它和
videos.xml文件关联了起来。您可以在 Associations 对话框中更改这种关联。先选择 videos.xsl[/b]文件,然后选择 Properties[/b]。这会启动
videos.xsl文件的 Properties 页。单击如图 3 所示的 Associations[/b] 选项卡启动 Associations 对话框。您可以看到
videos.xml文件目前已被关联起来了。
图 3. 把多个 XML 文档与一个 XSL 样式表关联起来
使用 Associations 对话框,您可以添加或删除关联,还可以设置缺省关联。如果某个 XML 文件被设置为一个 XSL 文件的缺省关联,那么对 XSL 文件的任何需要知道实例文件的处理(例如,转换、调试或 XPath 向导调用)都将自动使用该缺省关联进行。
将一个 XSL 样式表应用于许多个结构相同但内容有别的 XML 文档是很常见的。您可以使用 Associations 对话框来设置所有关联。当您更改 XSL 样式表时,您只需单击一下鼠标就可以选择 Transform all XMLs[/b] 操作来转换所有已与 XSL 样式表关联在一起的 XML 文件。
图 4. Transform all XMLs
改善录像商店的设计
至此,我已经演示了如何使用 XSL Editor 中的向导来根据 XML 文档快速创建样式表。但对于一个真实的录像商店来说,这个 HTML 表格看起来不是很吸引人。例如,您更愿意看到录像的真实图像吗?一种更吸引人的设计可能如下面的图 5 所示。当您访问该录像商店时,会给您显示一个最受欢迎影片的列表。接着,您可以通过单击链接选择某部特定的影片;这样将会显示一张图像和详细的描述,如下面的图 6 所示。
图 5. 影片列表
图 6. 一部被选中的影片
这样一个 Web 站点可以使用与它的数据源相同的
videos.xml。但是,要使用 XSL 样式表创建这个 Web 站点,您需要执行以下步骤:
创建能够处理超链接(
href)的样式表。
设计并部署将在运行时把 XSL 转换成 HTML 的 Web 应用程序。
在本文余下的几部分中,我们将着重讨论第一项任务。我们将研究可以用来调试 XSL 样式表的 XSL Debugger。在本系列的下一部分,我们将讨论如何构建将把这些样式表应用于输入数据以将输入数据转换成如上面的图 5 和图 6 所示的 HTML 输出的 Web 应用程序。
调试 XSL 样式表
创建一个名为
Scenario的新项目,然后把
xslExample1.zip的 Scenario 目录中的所有文件导入到本项目中。您将注意到,在
xsl文件夹中有两个 XSL 样式表:
movieList.xsl和
movieDetail.xsl。
movieList.xsl样式表用来显示影片列表。
moveDetail.xsl样式表用来显示一部特定影片的详细信息。
为了搞清楚
movieList.xsl的工作原理,我们将使用 XSL Debugger 来研究它。选择 movieList.xsl[/b]文件和 videos.xml[/b]文件。选择 Apply XSL =>As HTML[/b]。这会在 XSL Debug 透视图中启动 XSL Debugger,如下面的图 7 所示:
图 7. XSL Debugger
XSL Debugger 具有下列视图:
Sessions 视图显示调试会话列表。您可以从这个视图使用工具栏按钮在当前转换上单步向前
或单步向后
,如果在 XSL 源代码中设置了断点的话可以运行到某个断点
,或者在结果文档上打开浏览器
。
Current XSL Element 视图在您一步步执行转换的过程中显示 XSL 样式表中某个元素的详细信息。Actual Value 列显示该 XSL 元素被求值时的实际值。
Breakpoints 视图显示在 XSL 样式表上所设置的断点的列表。您可以使用这个视图除去断点。
Template Call Stack 视图显示调用堆栈中的模板的列表。当进入某个模板时,将会有一个条目被添加。当模板完成执行时,该条目就被从堆栈中除去。
XSL Debugger 还在一个平铺编辑器中打开输入 XML 和 XSL,以便在您一步步执行转换时把 XML 和 XSL 并排放在一起,这样看起来就很方便。不过,如果您的 XSL 样式表包含其他样式表,或者如果您的样式表转换多个文档,那么平铺编辑器读起来就很困难了,您可能会想简单地把各个编辑器层叠起来。要更改这一点,您可以选择 Windows =>Preference =>XML =>XSL Debugging[/b],然后取消对“Show all debugging files in a tile editor”复选框的选择,如下面的图 8 所示:
图 8. XSL Debugging 首选项
使用 XSL Debugger 研究 movieList.xsl 文件
在 Sessions 视图中,单击
按钮开始一步步执行转换。正被执行的 XSL 规则在 XSL 源代码编辑器中被突出显示。继续单步向前,直到到达下面定义变量
id的这一行。
<xsl:variable name="id" select="VID_ID"/> |
</xsl:variable>标记出现时所求得的结果。您将看到求得的上下文节点的值为 100,它是
VID_ID元素在当前迭代时的值。
继续单步向前,直到到达下面定义
href[/b]链接的行:
<a href="/VideoWeb/main/detail?videoId={$id}"> |
href属性定义了单击链接时将转到的页面的链接。那么,这个
href中包含什么内容呢?这个
href的第一部分定义了一个 URL
/VideoWeb/main/detail,它在 Web 应用程序中运行时有意义。我们将在本系列的下一篇文章中重新探讨这一部分。这个
href的第二部分定义了一个参数
videoId,它的值是根据
{$id}变量的值计算出来的。要求出对
videos.xml文件执行转换时这个
href的确切值,请在 Current XSL Element[/b]视图(如下面的图 9 所示)中查看它。注意,如果实际值很长,您可以使用 ...[/b] 按钮打开一个对话框。
图 9. 求 href 属性的值
您可以单步遍历
<xsl:for-each>循环在 XSL 元素被执行时查看每一个 XSL 元素,如果您只对查看某些值感兴趣的话也可以设置一个断点。我们来通过双击
<a href>元素所在的行在该元素上设置一个断点。您将注意到在第 28 行处添加了一个断点(一个绿色圆点),如图 7 所示。
现在,单击
按钮运行到该断点。注意,每次单击鼠标时,Current XSL Element 视图都会显示一个对应于
videos.xml文件中的
VID_ID元素的新
href属性值。 使用 XSL Debugger 研究 movieDetail.xsl 文件
接下来,我们将使用 XSL Debugger 仔细研究一下
movieDetail.xsl文件。先选择 movieDetail.xsl[/b]文件和 videos.xml[/b]文件,然后选择 Apply XSL =>As HTML[/b] 启动一个新的调试会话。
请回想一下,
movieDetail.xsl文件是被用来显示被选中影片的详细信息。必须将该影片的标识
videoId传递给这个样式表。在本系列的下一篇文章中,我们将向您展示当 URL 被请求时,如何从 servlet 动态传入这样一个参数。下面您将看到,出于设计这个样式表的目的,您可以用一个支架(scaffolding)值来代替。
在 XSL 源代码编辑器中,在下面这一行上设置一个断点,该行根据变量
$videoId测试
VID_ID值。
<xsl:if test="VID_ID=$videoId"> |
按钮运行到该断点。在 Current XSL Element 视图中,请注意求出的
<xsl:if test>的值将是
true。这是因为这个变量在这一行中被设置为值
100,并且这个值与来自
vidoes.xml文件的第一个元素值相匹配。
<xsl:variable name="videoId" select="100"/> |
按钮,那么
<xsl:if test>元素将返回
false,因为下一个
VID_ID值与当前值
100不匹配。 您可以修改 XSL 或 XML 源代码,然后重新启动 XSL Debugger 来立即看到结果。让我们像下面这样将
videoId值改为
103,然后保存文件。
<xsl:variable name="videoId" select="103"></xsl:variable> |
按钮在新转换上打开浏览器。您将会看到另一个影片描述。 图 10. 重新启动一个新的调试会话
结束语
本文描述了如何使用 WebSphere Studio Application Developer 版本 5.0 中的一些新的 XSL 工具。这些工具可以帮助初学者很快就可以开始使用 XSL,并且可以帮助 XSL 程序员中的高手提高工作效率。
WebSphere Studio Application Developer 5.0 中本文未描述的其他与 XSL 有关的工具包括:
XSL from XHTML 向导。它根据 XHTML 文件生成 XSL 样式表。如果您想把现有的 HTML 文件迁移到 XSL 和 XML 基础架构中,它还可以把数据转换成 XML 格式(可选)。
Java bean XML/XSL Web client 向导。它接受 Java bean,然后生成一个 DOM、一些可以应用于这个 DOM 的关联的 XSL 样式表和一个能够将这些 XSL 样式表应用于该 DOM(这样您便可以使用 XML 和 XSL 快速创建 Web 应用程序的前端)的 servlet。
支持使用 XSLTC的编译后的 XSL 样式表。
帮助您构建和测试 XPath表达式的 XPath 向导。
在本系列的下一篇文章中,我们将讲述如何开发和部署将使用我们在本文中创建的 XSL 样式表的 Web 应用程序。
下载
Name | Size | Download method | |||||||||
xslExample1.zip | 46 KB | HTTP | |||||||||
相关文章推荐
- 使用 WebSphere Studio Application Developer 的 WebSphere Portal Server 开发: 第 1 部分:Portal Server 2.1 的动态主题定制
- XML 和 WebSphere Studio Application Developer,第 5 部分:探究 RDB to XML Mapping Editor
- XML 和 WebSphere Studio Application Developer — 第 6 部分: 使用 XML Schema 和 XML Editor 揭开 XML 名称空间神秘的面纱
- XML 和 WebSphere Studio Application Developer: 第 8 部分:探究 XML to XML Mapping Editor
- XML 和 WebSphere Studio Application Developer,第 1 部分:开发 XML Schema
- 使用 WebSphere Studio Application Developer 调试器调试 WebSphere 应用程序: 第 1 部分
- 使用 WebSphere Studio Application Developer 调试器调试 WebSphere 应用: 第 2 部分
- XML 和 WebSphere Studio Application Developer — 第 2 部分: 创建 SQL 查询
- XML 和 WebSphere Studio Application Developer — 第 3 部分: SQL 和 XML
- 使用 WebSphere Studio Application Developer 集成版,版本 4.1 开发 Java 消息服务应用程序
- XML 和 WebSphere Studio Application Developer — 第 4 部分: 研究 XML Editor
- 使用 WebSphere Studio Application Developer 开发 Java 程序: 与 VisualAge for Java 进行比较
- 使用 WebSphere Studio Application Developer 构建 J2EE 应用程序客户机
- 在 WebSphere Studio Application Developer 中开发 J2EE 实用程序 JAR
- 在 WebSphere Studio Application Developer 内开发 WebSphere Transcoding Publisher Transcoders
- XML 和 WebSphere Studio Application Developer - 第九部分:利用 XML更新数据库表
- 使用 WebSphere Studio Application Developer 创建数据库应用程序
- 使用 Rational Application Developer 6.0 和 WebSphere Portal Server 5.1开发 JSF portlet
- 使用 IBM WebSphere Business Services Fabric 行业内容包加速 CBS 开发,第 1 部分:建模阶段
- 使用 Rational Application Developer 构建 HTTPS Web 服务,第 1 部分:Web 服务与 Web 服务客户机