且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

后代选择器和jQuery中的选择器有什么区别?

更新时间:2023-11-06 14:00:28

div p 中的后代选择器选择 div p 后代。

The descendant selector in div p selects the p descendants of the div.

div中的has()选择器:has(p) 选择 div 如果它包含任何 p 元素。

The :has() selector in div:has(p) selects the div if it contains any p elements.

大胆的部分是您需要知道的。其余部分可以被视为条件选择这些类型的哪些元素。

The bold parts are all you need to know. The rest can be seen as mere conditions as to which elements of those types are selected.

在CSS选择器术语中,键选择器是最右侧的外部简单选择器。 jQuery(或浏览器的CSS解析器)获取的元素类型是键选择器中的元素。

In CSS selector terms, the key selector is the right-most outer simple selector. The kind of elements that get picked up by jQuery (or by a browser's CSS parser) is the one in the key selector.

在第一个选择器中,键是 p ,因为它是最右边的一个,发生在后代组合子(空间)之后。这意味着将返回 p 元素的集合。

In the first selector, the key is p, because it's the right-most one, occurring after the descendant combinator (the space). This means a collection of p elements will be returned.

的情况下: has(),这是一个伪类, p 是一个内部简单选择器,它是 的一部分c $ c>:has()伪类,不是整个外部选择器的一部分。因此,该选择器中的键是 div ,而不是 p 。这意味着将返回 div 元素的集合,而不是第一个选择器中的 p 元素。

In the case of :has(), which is a pseudo-class, the p is an "inner" simple selector that is part of the :has() pseudo-class, not part of the entire "outer" selector. The key in that selector is therefore div, not p. This means a collection of div elements will be returned, rather than p elements in the first selector.