XSLT - Add attribute value based on positioning

Question

I need to transform html table in to another html table using XSLT. My goal is to modify the table cell colors to Zebra style. Literally Zebra style means change color of table rows one after another.

For simple tables (there are mo row merging in place), I used the row position values of the table row and changed the color of the odd positioned rows. The problem comes when there are cell merging in place in the table, This case I cannot use the modules value of the row position value, instead I have to consider the row span value and make some logic.

Here is an example,

<table>
    <tbody>
        <tr>
            <td rowspan="2">111</td>
            <td>222</td>
        </tr>
        <tr>
            <td>333</td>
        </tr>
        <tr>
            <td rowspan="4">444</td>
            <td>555</td>
        </tr>
        <tr>
            <td>666</td>
        </tr>
        <tr>
            <td>777</td>
        </tr>
        <tr>
            <td>888</td>
        </tr>
        <tr>
            <td rowspan="4">999</td>
            <td>101010</td>
        </tr>
        <tr>
            <td>111111</td>
        </tr>
        <tr>
            <td>121212</td>
        </tr>
        <tr>
            <td>131313</td>
        </tr>
        <tr>
            <td rowspan="5">141414</td>
            <td>151515</td>
        </tr>
        <tr>
            <td>161616</td>
        </tr>
        <tr>
            <td>171717</td>
        </tr>
        <tr>
            <td>181818</td>
        </tr>
        <tr>
            <td>191919</td>
        </tr>
        <tr>
            <td rowspan="4">202020</td>
            <td>212121</td>
        </tr>
        <tr>
            <td>222222</td>
        </tr>
        <tr>
            <td>232323</td>
        </tr>
        <tr>
            <td>242424</td>
        </tr>
    </tbody>
</table>

The expected output should look like this,

<table>
    <tbody>
        <tr>
            <td rowspan="2" color="shaded">111</td>
            <td color="shaded">222</td>
        </tr>
        <tr>
            <td color="shaded">333</td>
        </tr>
        <tr>
            <td rowspan="4">444</td>
            <td>555</td>
        </tr>
        <tr>
            <td>666</td>
        </tr>
        <tr>
            <td>777</td>
        </tr>
        <tr>
            <td>888</td>
        </tr>
        <tr>
            <td rowspan="4" color="shaded">999</td>
            <td color="shaded">101010</td>
        </tr>
        <tr>
            <td color="shaded">111111</td>
        </tr>
        <tr>
            <td color="shaded">121212</td>
        </tr>
        <tr>
            <td color="shaded">131313</td>
        </tr>
        <tr>
            <td rowspan="5">141414</td>
            <td>151515</td>
        </tr>
        <tr>
            <td>161616</td>
        </tr>
        <tr>
            <td>171717</td>
        </tr>
        <tr>
            <td>181818</td>
        </tr>
        <tr>
            <td>191919</td>
        </tr>
        <tr>
            <td rowspan="4" color="shaded">202020</td>
            <td color="shaded">212121</td>
        </tr>
        <tr>
            <td color="shaded">222222</td>
        </tr>
        <tr>
            <td color="shaded">232323</td>
        </tr>
        <tr>
            <td color="shaded">242424</td>
        </tr>
    </tbody>
</table>

This is how the table html view, before and after the trasformation,

I've spend a weeks for find a solution for this from XSLT and still unable to figured it out a way to do this. Can anyone suggest me a method for do this.

Answer 1

Try first grouping the rows:

<xsl:variable name="grouped-rows" as="element(rowgroup)*">
  <xsl:for-each-group select="td" group-starting-with="td[@rowspan]">
    <rowgroup><xsl:copy-of select="current-group()"/></rowgroup>
  </
</

then iterating over the groups:

<xsl:for-each select="$grouped-rows">
  <xsl:variable name="style" select="if (position() mod 2 = 0) then 'pink' else 'blue'"/>
  <xsl:for-each select="child::td">
    <td class="{$style}">
      <xsl:copy-of select="@*, node()"/>
    </
  </
</