Javascript 如何使用querySelectorAll（）查找表行的第一个单元格

我正试图通过表的数据属性值将其作为目标。然后，我想找到该表中每个

的第一个

，并为每个选中的

添加一个类

我尝试了以下操作，但仍无法理解错误的来源：

var mprimary = document.querySelectorAll("[data='regMultipleTable']");
for (var i = 0; i < mprimary.rows.length; i++) {
   var firstTD = mprimary.rows[i].cells[0];
   firstTD.className = 'your-the-first';
}

var mpprimary=document.queryselectoral（“[data='regMultipleTable']”）；
对于（变量i=0；i

我的桌子看起来像这样：

<table data="regMultipleTable">
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tbody>
</table>

1.
2.
3.
4.
5.
6.
7.
8.
9

我想用1、4、7等值来定位td。。。

---

请帮助

您可以使用以下选择器简化逻辑：

table[data='regMultipleTable'] td:first-child

此选择器的意思是“选择表中每个父级（行）的第一个td，数据属性为'regMultipleTable'”

在代码中，这可能看起来像：

var mpprimary=文档
.querySelectorAll（“表[data='regMultipleTable']td:第一个子项”）；
for（主数据的var节点）{
node.classList.add（“您的第一个”）；
}

。您的{
背景：黄色；
}

1.
2.
1.
2.
1.
2.
1.
2.

如果项目中有jquery，只需一行即可

$("table[data='regMultipleTable'] tr td:first").addClass("your-the-first")

@charlietfl评论之后

$("table[data='regMultipleTable']").find("tr").find("td:first").addClass("your-the-first")

更好。

querySelectorAll（）

返回具有该

数据属性的所有表的列表

如果可以有多个这样的表，则需要对它们进行循环

var mprimary = document.querySelectorAll("[data='regMultipleTable']");
mprimary.forEach(function(mprimary) {
  for (var i = 0; i < mprimary.rows.length; i++) {
    var firstTD = mprimary.rows[i].cells[0];
    firstTD.className = 'your-the-first';
  }
});

var mpprimary=document.queryselectoral（“[data='regMultipleTable']”）；
mpprimary.forEach（函数（mpprimary）{
对于（变量i=0；i

如果只有一个表，只需使用
querySelector
而不是
querySelectorAll
。它返回单个元素而不是列表。
如果您对该类所做的只是样式设置，则可以在表中放置一个元素，并将该类应用于该元素：


。突出显示{
背景颜色：黄色；
}

1.
2.
3.
4.
5.
6.
7.
8.
9
使用
querySelector
，而不是
queryselectoral
文档。queryselectoral（“table[data='regMultipleTable']td:first child”）
作为旁白，它应该是
你是第一个
。。。虽然你可能不想逃到撇号的地步。@Obsidiage，呵呵，是的！我宁愿把这个词拼错：）@Barmar谢谢！您是正确的。查询中的
tr
是不需要的，因为您使用的是空格（子体）。这只返回表中的第一个
td
，而不是每一行