如何通过jQuery函数只获取直接子元素

Question

我有这样的表结构:

<table1>
  <tbody>
    <tr>
      <td></td>
        ...
      <td>
        <table2>
          <tbody>
            <tr>
              <td></td>
            </tr>
          </tbody>
        </table>
      </td>
    </tr>
   </tbody>
  </table>

在JavaScript中,我有一个变量tbl与价值$(table1),然后我想获得的所有直接子元素(TR)<tbody>的table1.我的代码是:

$('tr', tb1)

显然它返回<tr>table1和table2中的所有元素.我想我可以过得去

$('tr', tb1).not(function(){return $(this).parent().parent()[0] != tb1;})

或者这种逻辑.

我知道$('table1 > tbody > tr')可以得到直接的孩子tr.不幸的是我不能用这个.

有人对此有好感吗？

谢谢.

Answer 1

你可以使用find():

tbl.find("> tbody > tr")

Answer 2

正如@ jave.web在评论中提到的那样

要搜索元素的直接子元素.children().它只会搜索直接的孩子,而不是更深入地穿越.http://api.jquery.com/children/

Answer 3

这正是人们应该小心嵌套表的原因。我真的希望您将它们用于数据而不是页面布局。

另一个可能会毁了你一天的问题是在嵌套表上使用 CSS 选择器......你基本上有同样的问题 - 你无法选择外部表的 TR 元素而不选择内部表中的元素。（您不能使用子选择器，因为它没有在 IE6 中实现）

这应该有效：

$("#table1 > tbody > tr")

但是，我建议您对 TBODY 元素进行硬编码，因为您不应依赖浏览器为您创建它。