Question

我有一个像这样的表结构：

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

在javascript中，我有一个变量tbl，其值为$(table1)，然后我希望得到<tbody> table1的所有直接子元素（tr）。我的代码是：

$('tr', tb1)

显然它返回table1和table2中的所有<tr>个元素。我想我可以通过

$('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元素进行硬编码，因为您不应该依赖浏览器为您创建它。

Answer 4

http://api.jquery.com/child-selector/

$('tb1 > tr')

Answer 5

如果您同时拥有两个元素的ID，并且想在代码下方找到直接使用的元素

$("#parent > #two")

如果要嵌套搜索，可以使用find。在此详细说明。 https://handyopinion.com/jquery-selector-find-nested-child-elements/

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

5 个答案: