Question

在我的HTML页面中，我有一个动态表，它从数据库接收数据。所有单元格都有数值。我需要检查不同列的不同条件，无论该值是小于还是大于特定值，并根据结果为该单元格提供背景颜色。而且我不想为每个td标签提供id。我想用JavaScript实现这一点。以下是我实施的代码。

function color() {
    var val = 0; //value to be compared with
    var header = document.getElementById("test").getElementsByTagName("th");
    for (var j = 0; j < header.length; j++) {
        if (header[j].innerHTML == "NB HC") { //comparing the table header
            var cells = document.getElementById("test").getElementsByTagName("td");
            for (var i = 0; i < cells.length; i++) {
                if (cells[i].innerHTML > val) {
                    cells[i].style.backgroundColor = "red";
                }
            }
        }
    }
}

在此代码之后，结果是，所有列都进行了比较。我希望这发生在标题为“NB HC”的列中。

我的HTML看起来像，

<body onload="color()">

<table  id="test">

    <tr>
        <td>B HC</td>
        <td>NB HC</td>
        <td>Support HC</td>
    </tr>

          <core:forEach items="${myCondition}" var="row">
       <tr>


                <td width="60 px" align="center">my Value</td>


               <td width="60 px" align="center">my Value 1</td>


               <td width="60 px" align="center">my Value 2</td>
     </tr>
    </core:forEach>
</table>

</body>

Answer 1

首先，您已找到标题列“NB HC”的索引。然后在记录上进行循环以与改变背景颜色进行比较

    function color() {
        var val = 0; //value to be compared with
        var ColIndexToCheck=0;
        var header = document.getElementById("test").getElementsByTagName("th");
        for (var j = 0; j < header.length; j++) {
        if (header[j].innerHTML == "NB HC") 
           ColIndexToCheck=j;
        }

          var trs= document.getElementById("test").getElementsByTagName("tr");
            for (var i = 0; i < trs.length; i++) {
                if (trs[i].cells[ColIndexToCheck].innerHTML > val) {
                    trs[i].cells[ColIndexToCheck].style.backgroundColor = "red";
                }
            }

}

Answer 2

好的，我们假设您有3个<td>标签，并且您不想识别它们。一个很好的解决方法是：

document.getElementsByTagName('td')[index#]因此，整个网页上的第一个<td>将是[0]的索引。您可以将其放在for循环中并将变量作为索引号，然后在上面的行之后添加一行以获取值.value或.nodeValue或{{1}取决于您要比较的子节点。

如上所述，循环的每次迭代都可以检查.innerText if是否是某种条件，并按照您想要的方式进行必要的更改。我会提供一个更彻底的答案，但我不知道你的HTML是什么样的。总而言之，我认为<td>之后的索引号是您所需要的，这样就不会返回问题中的所有标记，只返回特定标记。

javascript：根据表标题检查表中值的条件

2 个答案: