JSFiddle - React, Tailwind, and code Playground

by Евгений

HTML

<div id="users">
    <h3>Эта таблица озебрена с помощью CSS</h3>
    <table>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
</table></div>

<div id="users2">
    <h3>Эта таблица озебрена с помощью js</h3>
    <table>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
    <tr>
        <td>01</td><td>02</td><td>03</td>
    </tr>
</table></div>

CSS

#users table tr:nth-child(even){
    background: #dbdbdb;
}
table{
    width: 100%;
}
td{
    text-align: center;
    border: 1px solid black
}

h3{
    text-align: center;
    font-weight: bold;
    margin: 10px 0;
}

JavaScript

var table = document.getElementById('users2');
var trs = table.getElementsByTagName('tr');
for (i = 0, len = trs.length; i < len; i++) {
    if ((i + 1)%2==0) trs[i].style.background = '#cecece';
}