避免选择嵌套的 td。如何？

【问题标题】：Avoid selecting nested td's. How?避免选择嵌套的 td。如何？
【发布时间】：2013-01-04 21:27:06
【问题描述】：

我有这个代码：

$("#widgetstable tr td:nth-child("+column+")").hide();

但它会选择恰好嵌套在所选 td 内的任何 td。（还有一对。）

我试过$("#widgetstable > tr > td:nth-child("+column+")").hide();，但没有选择任何东西。

【问题讨论】：

也许您的表中有tbody？

不。这是开头的结构：'code'(

)

你能发布你想要应用它的 HTML 吗？一个 jsFiddle 也不错。

请记住，nth-child 作用于 index-origin 1，而不是 0。

@Beetroot-Beetroot - 我知道，我已经对此进行了 +1 数学运算。

标签： jquery jquery-selectors css-selectors

【解决方案1】：

当您的浏览器解析您的 HTML 时，tbody 是 inserted silently，> 选择器表示父级的直接子级。对于以下 HTML，此选择器将起作用：

<style>
   td {
     background-color: blue;
   }
</style>
<table id='widgetstable'>
  <tr>
    <td>Me</td>
  </tr>
  <tr>
    <td>
      <table>
        <tr><td>Not Me</td></tr>
      </table>
    </td>
  </tr>
</table>
<script>
  $("#widgetstable > tbody > tr > td").css('background-color', 'red');
</script>

Here is a demo

【讨论】：

不确定如何将此标记为已回答我的问题...但确实如此。
为了安全起见，我认为在 HTML 中包含明确的 <tbody> 是个好主意。您还可以给它一个 id 并将选择器简化为 $("#tbodyId").children("tr").children("td")。