Javascript 我需要更改multiple的css样式<；td>；身份相同

我有一个表，它是使用asp net创建的，使用foreach迭代viewModel的实例。 我需要更改它们的颜色，但它们都有相同的id

HTML

@foreach (var item in Model)
{
    <tr id="test">
        <td>    
            <p class="small">@Html.DisplayFor(modelItem => item.DT_CADASTRO_FORMATADO)</p>
        </td>
        <td>
            @Html.DisplayFor(modelItem => item.DSC_NATUREZA_INICIAL)
        </td> 
    </tr>
}

@foreach（模型中的变量项）
{
@Html.DisplayFor（modelItem=>item.DT\u CADASTRO\u FORMATADO）
@DisplayFor（modelItem=>item.DSC\u NATUREZA\u inical）
}

JavaScript

$("document")
     .ready(function ToPink() {
            for (var i = 0; i < 26; i++) {
                let tab = document.getElementById("test");
                if (tab.cells[1].innerText == 'foo') {

                    alert(tab.cells[1].innerText);
                }
            }
        }); 

$（“文档”）
.ready（函数ToPink（））{
对于（变量i=0；i<26；i++）{
let tab=document.getElementById（“测试”）；
if（tab.cells[1].innerText==“foo”）{
警报（tab.cells[1].innerText）；
}
}
}); 

嗯，ID应该是唯一的，但您要寻找的是一个CSS类。向

td

s添加一个类，然后使用

document.getElementsByCassName

提取具有该类名的所有元素。

ID应该是唯一的，因为getElementById函数只搜索一个首先存在给定ID的元素：

alert（document.getElementById（“nounique”）.innerHTML）
1
2给每个表一个类，在javascript中查询所有TD元素

<table class="test">
  ....
</table>

<script>
var TDs = document.querySelectorAll(".test td");
for (var i=0; i < TDs.length; i++) {
  // use TDs[i] here to style your html
}
</script>

由于html页面上只允许有一个id，所以不能使用
getElementById（）
以多个元素为目标。使用
getElementsByClassName（）
或
getElementsByTagName（）
以多个元素为目标。或者将
id
放在table tag
中，然后使用
测试trtd{/**table css**/}
@nosousa，如果您可以继续并将其标记为答案，那么它就解决了问题。很高兴听到它起作用了。我发现我只需要设计一些td，但非常感谢您。如果可能的话，给您想要设计样式的td一个
，然后使用
querySelectorAll（“td.test”）
或jquery
$（“td.test”）
。但是在
tbody>tr:nth child（..）>td:nth child（..）中也可以使用css
$(document).ready(function() {
  $(".test td").each(function(index) {
    // use $(this) here to style your html
  });
});