子选择器和ID

Question

我真的不明白为什么ID不是有效的父母： http://api.jquery.com/child-selector/

有效：

$("#listequestions tr").click(function() {
  $(this).addClass("success");
});

无效：

$("#listequestions > tr").click(function() {
  $(this).addClass("success");
});

有人可以帮助我理解为什么吗？

谢谢。

Answer 1

如果没有，tbody会自动插入到表格中。

这就是为什么唯一可能匹配"#listequestions > tr"的方法是将ID提供给thead，tfoot或tbody。

这是儿童选择器的危险之一。

假设您有以下HTML：

<table id=listequestions>
    <tr><td>some text</td></tr>
</table>​

然后tr将匹配这两个查询：

• $('#listequestions > tbody > tr')
• $('#listequestions tr')

Answer 2

您在这里选择具有id listequestions的元素中的直接子元素

$("#listequestions > tr").click(function() {
  $(this).addClass("success");
});

在这里，您选择具有id侦听的元素内的所有元素，其中包括子子元素。

$("#listequestions tr").click(function() {
  $(this).addClass("success");
});

由于

Answer 3

$("#listequestions  tr")

将尝试匹配all the children which are tr

$("#listequestions > tr")

将匹配only the immediate children ..

因此，如果tr不是直接孩子，那么第二个将不起作用..

正如破坏所指出的那样

Answer 4

这会改变吗？

$("#listequestions").children("tr").click(function() {
      $(this).addClass("success");
    });

Answer 5

$("#listequestions").find("tr").click(function() {
      $(this).addClass("success");
});