Javascript 改变<；tr>；bgcolor基于<；tr>'；它以HTML和CSS的形式出现

我在HTML页面中使用了多个

，其

bgcolor

值如下：

<tr bgcolor="#000000">
<tr bgcolor="#E5F1CC">
<tr bgcolor="#D30A0A">
<tr bgcolor="#656766">

我需要为所有

提供不同的背景色

HTML中没有使用类或ID

在不涉及HTML的情况下，我需要通过在HTML中指定元素的计数来为所有元素提供CSS背景色

i、 e我想计算HTML中存在的

元素的数量，并为它们提供不同的

颜色

有可能吗？
如果您不知道行数，您可以使用javascript

var trs = document.getElementsByTagName('tr');
for(var i=0; i<trs.length; i++){
    trs[i].style.backgroundColor = "#insertcolor";
}

这都是伪代码，因此可能存在语法错误。
不同行的简单CSS规则：

tr:nth-child(odd) { background-color: #ffffff; }
tr:nth-child(even) { background-color: #000000; }

或者，如果您有多种颜色，则可以以相同的方式针对特定行：

tr:nth-child(1) { background-color: #123456; }
tr:nth-child(2) { background-color: #654321; }

使用jQuery，您可以在tr标记上使用选择器

$("tr") or $("tr.specifyAClass")

然后您可以计算找到的tr的数量：

$("tr").length

然后可以在tr数组上循环并应用颜色。
可以使用jquery Addclass添加类名。将类名添加到表中，并使用该类nae获取tr。
然后使用jQueryCSS属性，比如$（tr.css（'backgroundcolor'，'red'）
 您可以试试这个，因为您想使用
bgcolor
而不想触摸
HTML
（）：

var trs=document.getElementsByTagName（'tr'），i=0，l=trs.length；
对于（；i

您要求使用固定颜色，因此请使用以下选项（）：

var colors=['#ccddee'、'#123aaa'、'#fb11']；
var trs=document.getElementsByTagName（'tr'），i=0，l=trs.length；
对于（；i

确保添加更多颜色，三行需要三种颜色。如果允许在多行中使用一种颜色，则可以这样做，因此不必为每行添加颜色。
1）这在所有主要浏览器中都受支持

HTML

<table>
    <tr>
        <td>1</td>
    </tr>
    <tr>
        <td>2</td>
    </tr>
    <tr>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
    </tr>
</table>

2） 我们还可以实现，除了IE8和更早版本之外，所有主流浏览器都支持使用CSS
：nth-child（）
选择器。of
：n-child（）

我不想使用jquery，请..我需要在cssok中使用它，因为你把javascript选项卡放在这里，我认为这是一个选项。在我看来，slash197的答案是好的。您也不能使用jQuery并编写大量javascript来执行同样的操作。我不想使用jQuery请..我需要它在csstable tr:nth child（奇数）{}表tr:nth child（偶数）{}请不要随机颜色..想要特定的bg颜色吗
var trs = document.getElementsByTagName('tr'), i = 0, l = trs.length;
for(; i < l; i++)
{
    trs[i].setAttribute('bgcolor', '#' + Math.random().toString(16).substr(-6));
}

var colors = ['#ccddee','#123aaa','#fbfb11'];
var trs = document.getElementsByTagName('tr'), i = 0, l = trs.length;
for(; i < l; i++)
{
    trs[i].setAttribute('bgcolor', colors[i]);
}

<table>
    <tr>
        <td>1</td>
    </tr>
    <tr>
        <td>2</td>
    </tr>
    <tr>
        <td>3</td>
    </tr>
    <tr>
        <td>4</td>
    </tr>
</table>

table {
    width:100%;
}
tr {
    height:50px;
    background:#000000;
}
tr + tr {
    background:#E5F1CC;
}
tr + tr + tr {
    background:#D30A0A;
}
tr + tr + tr + tr {
    background:#656766;
}

table {
    width:100%;
}
tr {
    height:50px;
    background:#000000;
}
tr:nth-child(2) {
    background:#E5F1CC;
}
tr:nth-child(3) {
    background:#D30A0A;
}
tr:nth-child(4) {
    background:#656766;
}