生成基于HTML div的表,其中列标题跨越多个(但不是全部)单元格

问题描述 投票:0回答:1

给定像这个片段的XML(将生成),我需要使用基于XSLT 1.0的div条目生成一个网页,如下所示:

  <div class="rTable">
     <div class="rTableRowS">
        <div class="hCell">SIT</div>
     </div>
     <div class="rTableRowS">
        <div class="rTableCellS">Header 1</div>
        <div class="rTableCellS">Header 2</div>
        <div class="rTableCellS">Header 3</div>
        <div class="rTableCellS">Header 4</div>
     </div>
     <div class="rTableRowQ">
        <div class="rTableCellQ">a1</div>
        <div class="rTableCellQ">single</div>
        <div class="rTableCellQ">a2</div>
        <div class="rTableCellQ">secondary</div>
        <div class="rTableCellQ">a3</div>
        <div class="rTableCellQ">single</div>
        <div class="rTableCellQ">a4</div>
        <div class="rTableCellQ">secondary</div>
     </div>
     <div class="rTableRowS">
        <div class="rTableCellS">header 5</div>
        <div class="rTableCellS">header 6</div>
        <div class="rTableCellS">header 7</div>
        <div class="rTableCellS">header 8</div>
     </div>
     <div class="rTableRowQ">
        <div class="rTableCellQ">b5</div>
        <div class="rTableCellQ">single</div>
        <div class="rTableCellQ">b6</div>
        <div class="rTableCellQ">secondary</div>
        <div class="rTableCellQ">b7</div>
        <div class="rTableCellQ">single</div>
        <div class="rTableCellQ">b8</div>
        <div class="rTableCellQ">secondary</div>
     </div>

期望的输出(外观和感觉):

SIT
Header 1    ¦ Header 2       ¦ Header 3         ¦ Header 4
a1 ¦ single ¦ a2 ¦ secondary ¦ a3 ¦ single ¦ a4 ¦ secondary 
Header 5    ¦ Header 6       ¦ Header 7         ¦ Header 8
b5 ¦ single ¦ b6 ¦ secondary ¦ b7 ¦ single ¦ b8 ¦ secondary 

等等。

什么是简单的XSLT1.0转换来实现列匹配(基于div)。我可以将输入XML调整到某种程度,例如更改类条目。

html xslt-1.0
1个回答
0
投票

使用嵌套显示=表条目的div解决:一行包含再次包含表的单元格。

© www.soinside.com 2019 - 2024. All rights reserved.