- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
我按照 this post from StackOverflow 的说明生成了一个每行 2 个单元格的 HTML 表格
但我想将我的数据分布在一个 HTML 表格中,每行三个单元格。我更改了帖子中 XSLT 样式表中 sibling 的数字和 position 的计算,但它似乎不起作用。
这是我的 XML 源:
<?xml version="1.0" encoding="UTF-8"?>
<report>
<frontmatter>
<title>Relatório da 4ª Sessão Intercalar</title>
<subtitle>Projecto Integrado de Engenharia de Linguagens</subtitle>
<authors>
<author>
<name>Marina Mac</name>
<nident>pg999</nident>
<email>pg999@minho.pt</email>
<url>https://www.linkedin.com</url>
<affil>Universidade do Minho</affil>
<photo>source/img/authors/marina.png</photo>
</author>
<author>
<name>Nuno Vie</name>
<nident>pg998</nident>
<email>pg998@minho.pt</email>
<url>https://www.linkedin.com</url>
<photo>source/img/authors/nuno.jpg</photo>
<affil>Universidade do Minho</affil>
</author>
<author>
<name>Damien Va</name>
<nident>pg997</nident>
<photo>source/img/authors/damien.jpg</photo>
<url>https://www.linkedin.com</url>
<email>pg997@minho.pt</email>
<affil>Universidade do Minho</affil>
</author>
<author>
<name>Tiago Mach</name>
<nident>pg996</nident>
<email>pg996@minho.pt</email>
<url>https://www.linkedin.com</url>
<affil>Universidade do Minho</affil>
<photo>source/img/authors/marina.png</photo>
</author>
<author>
<name>Manuel Vie</name>
<nident>pg995</nident>
<email>pg995@minho.pt</email>
<url>https://www.linkedin.com</url>
<photo>source/img/authors/nuno.jpg</photo>
<affil>Universidade do Minho</affil>
</author>
<author>
<name>Damien Vim</name>
<nident>pg994</nident>
<photo>source/img/authors/damien.jpg</photo>
<url>https://www.linkedin.com</url>
<email>pg994@alunos.uminho.pt</email>
<affil>Universidade do Minho</affil>
</author>
</authors>
</frontmatter>
</report>
这是我的 XSLT 代码,它不符合我的要求:
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
xmlns:xs="http://www.w3.org/2001/XMLSchema"
exclude-result-prefixes="xs" version="2.0">
<xsl:output indent="yes"/>
<xsl:template match="/report">
<html>
<head>
<meta charset="utf-8"/>
<title><xsl:value-of select="frontmatter/title"/></title>
</head>
<body>
<xsl:apply-templates select="frontmatter"/>
</body>
</html>
</xsl:template>
<xsl:template match="frontmatter" >
<table width="100%">
<tr align="center">
<td>
<h1><xsl:value-of select="title"/></h1>
</td>
</tr>
<xsl:if test="subtitle != '' ">
<tr align="center">
<td>
<xsl:value-of select="subtitle"/>
</td>
</tr>
</xsl:if>
</table>
<hr width="90%"/>
<h2>Autores</h2>
<table width="90%" align="center">
<xsl:apply-templates select="authors/author[position() mod 2 = 1]"/>
</table>
</xsl:template>
<xsl:template match="authors/author">
<tr>
<xsl:for-each select=". | following-sibling::author[1]" >
<td>
<p><xsl:value-of select="name"></xsl:value-of></p>
</td>
</xsl:for-each>
<xsl:if test="not(following-sibling::author)">
<td/>
<td/>
</xsl:if>
</tr>
</xsl:template>
</xsl:stylesheet>
如何修复我的样式表,使其生成每行 3 个单元格的 HTML 表格?
最佳答案
如果您有 6 位作者,我假设您期望这样的结果:
<table width="90%" align="center" border="1">
<tr>
<td>Marina Machado</td>
<td>Damien Vaz</td>
<td>Manuel Vieira</td>
</tr>
<tr>
<td>Nuno Vieira</td>
<td>Tiago Machado</td>
<td>Damien Vaz</td>
</tr>
</table>
如果您有三位或更多作者,您将始终拥有三列。列少于三列的唯一情况是您有零个、一个或两个作者。这些列将从从左到右填充,因此如果您有 7 位作者,则最后一行第一列中只有一位作者。
这将是五位作者的结果:
<table width="90%" align="center" border="1">
<tr>
<td>Marina Machado</td>
<td>Damien Vaz</td>
<td>Manuel Vieira</td>
</tr>
<tr>
<td>Nuno Vieira</td>
<td>Tiago Machado</td>
</tr>
</table>
如果有七个,将创建一个新行:
<table width="90%" align="center" border="1">
<tr>
<td>Marina Machado</td>
<td>Damien Vaz</td>
<td>Manuel Vieira</td>
</tr>
<tr>
<td>Nuno Vieira</td>
<td>Tiago Machado</td>
<td>William Shakespeare</td>
</tr>
<tr>
<td>Heitor Villa-Lobos</td>
</tr>
</table>
在给定源 XML 的情况下,您可以使用此样式表生成满足这些要求的 HTML 表格(我将其缩减为代码的基本部分以处理分组问题 - 您稍后可以重新适应你的代码):
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:output indent="yes"/>
<xsl:strip-space elements="*"/>
<xsl:param name="cols">3</xsl:param> <!-- set the number of rows here -->
<xsl:template match="frontmatter" >
<table width="90%" align="center" border="1">
<xsl:apply-templates select="authors/author[position() mod $cols = 1 or position() = 1]" mode="row"/>
</table>
</xsl:template>
<xsl:template match="authors/author" mode="row">
<tr>
<xsl:apply-templates select=". | following-sibling::author[position() < $cols]" mode="cell"/>
</tr>
</xsl:template>
<xsl:template match="authors/author" mode="cell">
<td>
<xsl:value-of select="name"/>
</td>
</xsl:template>
</xsl:stylesheet>
如果您决定将作者分布在不同数量的列中,您可以传递 cols
参数具有不同的值或替换参数中的值 <xsl:param name="cols">3</xsl:param>
与另一个值(value)。例如,如果您将其更改为 4 列,它将像这样分布您的作者:
<table width="90%" align="center" border="1">
<tr>
<td>Marina Machado</td>
<td>Nuno Vieira</td>
<td>Damien Vaz</td>
<td>Tiago Machado</td>
</tr>
<tr>
<td>Manuel Vieira</td>
<td>Damien Vaz</td>
</tr>
</table>
在这个模板中计算行数:
<xsl:template match="frontmatter" >
<table width="90%" align="center" border="1">
<xsl:apply-templates select="authors/author[position() mod $cols = 1 or position() = 1]" mode="row"/>
</table>
</xsl:template>
XPath 表达式选择其位置 除以列数余数为 1 的作者。对于三列,它将选择 <author>
elements number 1, 4, 7, 10, ... 它还将选择 last 元素(可能不是其中之一)。它将调用第一个 author
标有 mode="row"
的模板.
该模板选择将包含每行单元格数据的元素:
<xsl:template match="authors/author" mode="row">
<tr>
<xsl:apply-templates select=". | following-sibling::author[position() < $cols]" mode="cell"/>
</tr>
</xsl:template>
它将选择当前 author
( .
),以及距离 $cols
的以下 sibling - 1. 如果$cols
是3,那么它会选择当前的author
和接下来的两个authors
如果它们存在。这样,它将选择将放置在一行中的所有元素。例如,如果之前的模板选择了元素 1 和 4(3 列),则此模板将为第一列选择元素 1(当前)、2 和 3,为第二列选择元素 4(当前)、5 和 6。此选择将用于应用 mode="cell"
仅打印 name
的模板<td>
中作者的子元素 block 。
此解决方案适用于 XSLT 1.0或2.0。
您可以看到在这个 XSLT Fiddle 中工作的代码
关于xml - XSLT:如何生成每行 3 个单元格的 HTML 表格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24252603/
我已经尝试在我的 CSS 中添加一个元素来删除每三个 div 的 margin-right。不过,似乎只是出于某种原因影响了第 3 次和第 7 次。需要它在第 3、6、9 等日工作... CSS .s
如何使 div/input 闪烁或“脉冲”?例如,假设表单字段输入了无效值? 最佳答案 使用 CSS3 类似 on this page ,您可以将脉冲效果添加到名为 error 的类中: @-webk
我目前正在尝试构建一个简单的 wireframe来自 lattice 的情节包,但由沿 y 轴的数百个点组成。这导致绘图被线框网格淹没,您看到的只是一个黑色块。我知道我可以用 col=FALSE 完全
在知道 parent>div CSS 选择器在 IE 中无法识别后,我重新编码我的 CSS 样式,例如: div#bodyMain div#paneLeft>div{/*styles here*/}
我有两个 div,一个在另一个里面。当我将鼠标悬停 到最外面的那个时,我想改变它的颜色,没问题。但是,当我将鼠标悬停 到内部时,我只想更改它的颜色。这可能吗?换句话说,当 将鼠标悬停到内部 div 上
我需要展示这样的东西 有人可以帮忙吗?我可以实现以下输出 我正在使用以下代码:: GridView.builder( scrollDirection: Axis.vertical,
当 Bottom Sheet 像 Android 键盘一样打开时,是否有任何方法可以手动上推布局( ScrollView 或回收器 View 或整个 Activity )?或者你可以说我想以 Bott
我有以下代码,用于使用纯 HTML 和 CSS 显示翻转。当您将鼠标悬停在文本上时,它会更改左右图像。 在我测试的所有浏览器中都运行良好,Safari 4 除外。据我收集的信息,Safari 4 支持
我构建了某种 CMS,但在使用 TinyMCE 和 Bootstrap 时遇到了一些问题。 我有一个页面,其中概述了一个 div,如果用户单击该 div,他们可以从模态中选择图像。该图像被插入到一个
出于某种原因,当我设置一个过渡时,当我的鼠标悬停在一个元素上时,背景会改变颜色,它只适用于一个元素,但它们都共享同一个类?任何帮助我的 CSS .outer_ad { position:rel
好吧,这真的很愚蠢。我不知道 Android Studio 中的调试监视框架发生了什么。我有 1.5.1 的工作室。 是否有一些来自 intellij 的 secret 知识来展示它。 最佳答案 与以
我有这个标记: some code > 我正在尝试获取此布局: 注意:上一个和下一个按钮靠近#player 我正在尝试这样: .nextBtn{
网站:http://avuedesigns.com/index 首页有 6 个菜单项。我希望每件元素在您经过时都有自己的颜色。 这是当您将鼠标悬停在 div 上时将所有内容更改为白色的行 li#hom
我需要在 index.php 文件中显示它,但没有任何效果。我所有的文章都没有正确定位。我将其用作代码: 最佳答案 您可以首先检查您
我是一名优秀的程序员,十分优秀!