我正在尝试使用 querySelector 来查找表的 NEXT 行中的第一个单元格。因此，从 ROW 1 开始，找到下一个 TR 元素，然后找到该 TR 元素中的第一个子 TD 元素。
但是，当我编写 CSS 选择器时，它返回 null 。
我的 CSS 选择器语法是:
"tr.row ~ tr td"
这是一个完整的工作示例:
<!DOCTYPE html>
<html>
<head>
<script>
function findRow()
{
var row1 = document.querySelector("tr.row");
var targetCell = row1.querySelector("tr.row ~ tr td");
alert(targetCell);
}
</script>
</head>
<body>
<table>
<tr class = "row">
<td class = "cell"></td>
</tr>
<tr class = "row">
<td class = "cell"></td>
</tr>
</table>
<script>
findRow();
</script>
</body>
</html>
所以选择器
".row1 成功地给了我 ID 为 row1 的 TR 元素。但是，第二个选择器
".row1 ~ tr td" 返回 null 。现在，如果不是使用
querySelector 元素调用 TR ，而是调用 document.querySelector ，它就可以工作。我什至可以调用 row1.parentNode.querySelector ，然后它也能正常工作。这向我表明调用 querySelector 的实际 Element 不包含在要搜索的元素集中。不幸的是，这不是这里的解决方案。这只是一个简化的例子:在我的实际用例中，我不能从
querySelector 上方的父元素调用 row1 ，因为那样我将失去我所在的上下文 - (在我的实际用例中，我有很多动态- 生成的行，所以如果我调用 document.querySelector ，甚至 row1.parentNode.querySelector 我将丢失我的上下文)。我意识到我可以用普通的 DOM 遍历循环来做到这一点，但我试图养成在这里使用
querySelector 的习惯，因为这显然对 future 更好。 (另外，我在这里没有使用 jQuery。)我也怀疑 :scope 选择器在这里会有所帮助，但不幸的是，它还没有得到广泛支持。那么可以使用
querySelector 做我想做的事吗？ 最佳答案
使用 querySelector 会很困难。 element.querySelector 的问题在于它只针对后代节点。最好使用类似的东西
var targetCell = row1.nextElementSibling.cells[0];
var row1 = document.querySelector("tr.row"),
targetCell = row1.nextElementSibling.cells[0];
alert(targetCell);<table>
<tr class="row">
<td class="cell"></td>
</tr>
<tr class="row">
<td class="cell"></td>
</tr>
</table>如果你真的想使用它，你可以在 parent 上使用
:nth-child(k) 来引用 k th 元素。var parent = row1.parentElement,
index = [].slice.call(parent.children).indexOf(row1) + 1,
targetCell = parent.querySelector(":nth-child("+index+") ~ tr td");
var row1 = document.querySelector("tr.row"),
parent = row1.parentElement,
index = [].slice.call(parent.children).indexOf(row1) + 1,
targetCell = parent.querySelector(":nth-child("+index+") ~ tr td");
alert(targetCell);<table>
<tr class="row">
<td class="cell"></td>
</tr>
<tr class="row">
<td class="cell"></td>
</tr>
</table>关于javascript - 使用 querySelector 查找同级行中包含的下一个单元格，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/27571808/