javascript - 如何创建自动生成的备用表格行颜色？

Question

我一直在努力使这段 CSS 代码起作用:

table.mytable {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 0.8em;
    border-collapse: collapse;
}
table.mytable td, table.mytable th { 
    width: auto;
    padding: 2px 4px;
    vertical-align: top;
}
table.mytable th {
    color: #fff;
    background:url(images/header-bg.gif);
    text-align: left;
}
table.mytable tr.alternateColor {
    background-color:#E9F3FC;
}

好吧，如果我手动编写它，它就可以工作。但是由于表将通过 asp.NET (Aspx) 生成，这不是手动创建的 - 我希望我的表生成备用行。我一直在尝试使用 Javascript 来完成这项工作，但我无法弄清楚，我相信这是一个很好的资源站点。

我一直在使用 Adob​​e Dreamweaver cs4 的手动表格作为测试，但我必须放置“alternatecolors”类才能使它们出现，但我无法正常执行此操作。:

问题是，有人可以为我提供一个好的 Javascript，我会把它放在文件的标题中，并实际帮助我完成这项工作吗？我想我被烧毁了……或者由于我花费的时间太多，我无法快速看到别人看到的东西。

我刚刚尝试在这里发布我的表格代码，但我无法正确格式化它，我必须运行...

我没有在此表上使用“id”，但类是“mytable”。

非常感谢您的帮助。更新:如何解决这个问题在定义表格的 CSS 文件上，我不得不添加这两行(当然还有更多行来定义一个好的表格)..但是这两行很重要

table.alternate td.odd { background-color:#fff}
table.alternate td.even { background-color:#e6e6e6; }

然后，我将这些行添加到 html 中，就在绘制表格之前。这是一个激活表的奇数和偶数属性的 Jquery 东西

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script>
$(document).ready(function()
{
  $("table.alternate tr:even td").addClass("even");
  $("table.alternate tr:odd td").addClass("odd");
});
</script>

如果您觉得有帮助，请尝试一下，如果它不起作用，则可能是我所不知道的其他问题。但这对我来说效果很好。

Answer 1

使用 jQuery:

$('.mytable tr:odd').addClass('alternateColor');