我正在尝试更改静态 html 表中 td 元素的背景颜色。我将通过数据库调用找到 td,并且需要通过将背景颜色从无变为黄色来显示 td。我已经构建了一个 css 文件来匹配 td 类属性,因此我可以按类 id 隔离表格单元格:
例如——
<table id="radarTable">
<tr>
<td class="a01"></td>
<td class="a02"></td>
<td class="a03"></td>
<td class="a04"></td>
<td class="a05"></td>
<td class="a06"></td>
<td class="a07"></td>
<td class="a08"></td>
<td class="a09"></td>
<td class="a10"></td>
</tr>
</table>
css代码示例-
#yellowZone
{
height: 12px;
width: 12px;
background-image: url(../images/yellowSquare.gif);
background-repeat: no-repeat;
}
#radarTable table td{
border: 1px solid #666666;
height: 12px;
width: 12px;
}
.a01{
}
.a02{
}
.a03{
}
.a04{
}
.a05{
}
.a06{
}
.a07{
}
.a08{
}
.a09{
}
.a10{
我知道我正在挑战极限,在我摆脱这个概念之前,我无法推进我客户的元素。我对此很强制,无法集中精力完成这个想法。任何建议都会很棒。谢谢罗伯特。
编辑答案中的评论:
作为回应,首先感谢您非常准确的评论。我有两种形式的表 - id 元素作为唯一标识符和类声明。如果使用 id 不需要 css 文件来声明它们,那么这是最好的方法吗?
此外,我正在使用 jquery,但我仍处于学习曲线的前沿。我确实有aspnet经验,所以概念没问题。该对话非常有帮助,您的回答会让我度过“用头撞显示器”的代码块阶段。
数据库调用将加载一个 jquery 数组,我将遍历并分配定位单元格的背景颜色,使它们“可见”以通过位于表格后面的图形显示。这将实现我正在努力的 ui 结果。感谢您的评论。完成后我会发布我的输出。
罗伯特
感谢您的帮助。一些建议可能会奏效;但是关于 jquery class attrib 的答案效果很好。如果您想查看实际建议,我有我的测试元素的网址。 http://www.stewardtech.net/dtvMap.php哇,我想回到这个元素上工作。顿悟时刻不属于我,但无论如何我都会接受。当我被卡住时,我脑子里的泥巴很厚,我无法前进,直到我解决了这个问题。
罗伯特
最佳答案
一些事情:
- 我注意到 yellowZone 没有定义一个“点”前缀来使它成为一个类。这是故意的吗?
- 您可以使用 id 属性来唯一标识每个 td,而不是使用类。
- 如果您确实想使用一个类,如果它仅用于检索元素,则无需在您的 css 文件中定义它。
- 如果您继续使用 id,您应该能够使用 document.getElementById("id") 来检索适当的表格单元格。例如:
HTML:
<body>
<table>
<tr>
<td id="a01"></td>
</tr>
<tr>
<td id="a02"></td>
</tr>
</table>
</body>
Javascript:
var tableData = document.getElementById("a01");
tableData.setAttribute("class", "yellowZone");
// Some versions of IE don't like the attribute "class"
tableData.setAttribute("className", "yellowZone");
关于javascript - 通过 javascript 和 css 访问 html 表的 td 属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/1575831/