在仅位于根表内但不在嵌套表内的行中选择“td”

Question

我有一个表格，可以包含在抽屉内呈现的嵌套表格。 嵌套表是相同的组件，我正在尝试创建一个 css 选择器，它将选择根表行而不是嵌套表行的

td

元素。

我从以下选择器开始：

table.querySelectorAll(`tbody tr > td:nth-child(${index + 1})`)

它确实从所有表的所有行中选择了正确的 td 元素。我应该注意到，嵌套表位于具有

[data-state="open"]

的 div 中，但到目前为止它对我没有帮助。我考虑如何从嵌套行确定行的唯一方法是它有 1 个父表元素而不是 2 个。

谢谢

Answer 1

要选择直接子项，您可以使用

>

，它是直接子项选择器：

table.querySelectorAll(`tbody > tr > td:nth-child(${index + 1})`);