Der Versuch, Zebrastreifen beliebige Zeilen in einer Tabelle

Question

Ich habe eine Tabelle, die Zeilen hat, die durch eine Klasse markiert. Diese Zeilen werden sollen Zebra gestreift. Der Nachteil ist, dass sie nicht immer in Folge.

Ich habe von Tisch und Klassennamen versucht, passende, aber das Endergebnis ist immer falsch. Was geschieht, ist, dass die Streifen auf der Tabellenebene angewendet wird und dann nur aktiviert, in den Zeilen mit der Klasse.

Was muss ich diese Arbeit zu machen ändern, wie ich die Absicht?

Schrift

function FormatTable()
{
   $("#TableId .arbitrarySelector:nth-child(2n+1)" ).addClass('anotherEquallySpecialRow')
}

HTML

<table id="TableId" onclick="FormatTable()">
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should NOT be changed but is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr>
        <td><div class="space"></div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should be Changed and is</div></td>
    </tr>
    <tr class="arbitrarySelector">
        <td><div class="space">Should Not be Changed and is Not</div></td>
    </tr>
</table>

Answer 1

Sie könnten machen dies zu schwierig. Wenn Sie Zebra Striping tun wollen, warum nicht nur so etwas wie die : odd Wähler und ändern die Klasse abhängig. So etwas wie dies ...

// Add zebra striping.
$('.arbitrarySelector:odd').addClass('zebra');

Und dann würde die CSS so etwas wie ...

.zebra 
{
    background-color: #dddddd;
}