Question

使用此标记：

<div id="e">  
    <div id="f"></div>  
</div>

$('#e > #f')是否与$('#e #f')返回相同的内容？

Answer 1

parent > child选择器只会查找直接子元素，而ancestor descendant会查找任何后代元素。

例如，使用以下标记：

<div class="foo">
  <div>
    <div class="bar"></div>
  </div>
</div>

$('.foo > .bar')找不到.bar元素，而$('.foo .bar')找不到，因为.foo不是来自.bar的直接子，但它是后代。

Answer 2

首先，我假设您的意思是$('#e > #f')和$('#e #f')。

在你的例子中，他们都将返回相同的东西。区别在于$('#e #f')在这种情况下也会返回div：

<div id="e">
  <div id="g">
    <div id="f"></div>
  </div>
</div>

另一方面，

$('#e > #f')将不返回任何内容，因为它只选择直接子项其他元素的元素。

Answer 3

这不起作用，因为您没有指定要查找的元素。你需要把#e＆gt; #f或#e #f用你的ID抓取。

如果这是一个真实的场景，＃e＆gt; #f只能找到孩子，下面没有嵌套。 #e #f将抓取任何id =“f”元素，无论它们在你的结构中嵌套多远。

Answer 4

在这个例子中，是的，他们将返回相同的东西。

Answer 5

是的，因为HTML中没有e或f元素，它们将始终返回空的jQuery对象。

如果该元素是$('#e > #f')元素的直接后代，则调用id="f"将返回带有id="e"的元素。

如果元素位于$('#e #f')元素内的某个位置，则调用id=f将返回带有id="e"的元素。

编辑：
注意：由于问题是在我回答之后编辑的，因此第一句不适用于目前的问题。