Javascript 为什么这个jQuery选择器表达式中的空格是相关的

假设我有这个HTML片段，假设其余文档没有其他div：

<div>
    <p>Lorem ipsum dolor sit amet</p>
     <pre>1st</pre>
</div>

将整个场景的背景色设置为红色，将颜色设置为绿色。 换句话说，我希望两个jQuery选择器都匹配包含单个div的同一组元素。然而，第一个选择器似乎只匹配，而第二个选择器实际上匹配

div:haspre:eq0使用。另一个没有

这是为了匹配CSS选择器的行为。

div:haspre:eq0使用。另一个没有

---

这是为了匹配CSS选择器的行为。

在CSS选择器中，空格表示的是。所以divp意味着所有标记都是a的后代

当您执行'div:haspre:eq0'时，您正在将：has和：eq应用于div选择器，因此您将找到具有内部的第一个

---

另一方面，“div:haspre:eq0”将找到任何具有内部的子元素中的第一个子元素。

在CSS选择器中，空格表示的是的后代。所以divp意味着所有标记都是a的后代

当您执行'div:haspre:eq0'时，您正在将：has和：eq应用于div选择器，因此您将找到具有内部的第一个

---

另一方面，“div:haspre:eq0”将找到任何内部选择器的第一个子级。

FYI，jQuery有关于其支持的所有选择器的文档：FYI，jQuery有关于其支持的所有选择器的文档：好的，我不知道像：eq这样的“伪类选择器”也有类似于Denarat选择器的行为！谢谢大家!@安德烈：空格是后代选择器：情商的行为与任何东西都不一样。这只是另一个选择器eq只是*：eq的缩写形式。请看，在可能省略前导类型选择器或通用选择器之后，在简单选择器序列中的任何位置都可以使用伪类。@Felix Kling。。。我知道：eq本身不是后代选择器；-。。。也许我应该说‘在后代选择器的上下文中’？好吧，我不知道‘伪类选择器’像：eq也像后代选择器一样！谢谢大家!@安德烈：空格是后代选择器：情商的行为与任何东西都不一样。这只是另一个选择器eq只是*：eq的缩写形式。请看，在可能省略前导类型选择器或通用选择器之后，在简单选择器序列中的任何位置都可以使用伪类。@Felix Kling。。。我知道：eq本身不是后代选择器；-。。。也许我应该说‘在后代选择器的上下文中’？我的解释要好得多。@Andy，我同意，这应该得到更多的投票。另一个FGITW案例。在我看来，这是更好的解释。@Andy，我同意，这应该得到更多的选票。另一例FGITW。

$('div:has(pre) :eq(0)').css('background-color','red');
$('div:has(pre):eq(0)').css('color','green');