Чередование цветов строк в классе tr с помощью XSL

У меня есть документ XSL, который имеет varaible количество статей, вставленных в него. Мне нужно, чтобы цвета фона статей чередовались - "нечетные", затем"четные"

<xsl:for-each select="newsletter/section/article">
    <tr class="odd" style="background-color: #efefef;">
        <td valign="top">
            <xsl:element name="a">
                <xsl:attribute name="href">
                    <xsl:value-of select="link" />
                </xsl:attribute>
                <img align="left" valign="top" width="110" 
                            style="padding: 0 4px 4px 0; border:0;">
                    <xsl:attribute name="alt">
                        <xsl:value-of select="title" />
                    </xsl:attribute>
                    <xsl:attribute name="src">
                        <xsl:value-of select="img" />
                    </xsl:attribute>
                </img>
            </xsl:element>
        </td>
        <td valign="top" style="padding: 4px 4px 18px 0;">
            <strong>
                <xsl:element name="a">
                    <xsl:attribute name="href">
                        <xsl:value-of select="link" />
                    </xsl:attribute>
                    <xsl:value-of select="title"/>
                </xsl:element>
            </strong>
            <br />
            <xsl:value-of select="excerpt"/>
        </td>
    </tr>
</xsl:for-each>

Я посмотрел на этот пост: таблица HTML с чередующимися цветами строк через XSL

но я считаю, что мой случай отличается. Мне просто нужно изменить класс tr на каждой итерации. Извините за странное форматирование, кажется, у меня проблемы с вставкой кода в Chrome здесь.

4 ответов


использование:

<xsl:for-each select="newsletter/section/article">
  <xsl:variable name="vColor">
    <xsl:choose>
      <xsl:when test="position() mod 2 = 1">
        <xsl:text>#efefef</xsl:text>
      </xsl:when>
      <xsl:otherwise>#ababab</xsl:otherwise>
        </xsl:choose>
      </xsl:variable>


  <tr class="odd" style="background-color: {$vColor};">

<xsl:for-each select="date">
    <tr>
        <xsl:if test="position() mod 2 = 1">
            <xsl:attribute name="class">odd</xsl:attribute>
            <xsl:attribute name="style">background-color: #efefef;"
            </xsl:attribute>
        </xsl:if>
        <td valign="top">
            <a href="{link}">
                <img align="left" valign="top" width="110"
                            style="padding: 0 4px 4px 0; border:0;"
                            alt="{title}"
                            src="{img}"/>
            </a>
        </td>
        <td valign="top" style="padding: 4px 4px 18px 0;">
            <strong>
                <a href="{link}">
                    <xsl:value-of select="title"/>
                </a>
            </strong>
            <br />
            <xsl:value-of select="excerpt"/>
        </td>
    </tr>
</xsl:for-each>

использовать position() и остаток при делении на два.


ваш случай очень похож. То, что вы должны сделать, это определить имя класса на основе позиции. @Jim Garrison дает вам хорошую подсказку, но я думаю, что пример необходим, потому что есть примеры с position() в примерах ссылка и вопрос задал.

<xsl:for-each select="newsletter/section/article">
  <!-- create index-based variable -->
  <xsl:variable name="classname">
    <xsl:choose>
      <xsl:when test="position() mod 2 = 0">
        <xsl:text>even</xsl:text>
      </xsl:when>
      <xsl:otherwise>
         <xsl:text>odd</xsl:text>
      </xsl:otherwise>
    </xsl:choose>
  </xsl:variable>
  <!-- insert contents of your variable -->
  <tr class="{$classname}" style="background-color: #efefef;">
....