如何在 querySelector 中组合属性和第 nth-of-type？

Question

我正在尝试 select table 中的一个单元格的属性（为此我可以使用 querySelector("[data-name]")，但我希望它 return 仅第三列中的元素。是否可以将属性搜索与 nth-of-type(2) 结合使用？

我试过使用 querySelector("[data-name]:nth-of-type(2)"] 但这不起作用。

Answer 1

对于第 3 列尝试使用 nth-of-type(3)

:nth-of-type() 是一个 css 选择器，第一个 child 的索引将为 1

console.log(document.querySelector("table tr [data-name]:nth-of-type(3)"));

<table>
  <tr>
    <td data-name="1">1</td>
       <td data-name="2">2</td>
        <td data-name="3">3</td>
    <tr>
      </table>

How can I combine an attribute and nth-of-type in querySelector?