javascript - 在 jQuery 中使用带有上下文节点的子选择器的新正确方法是什么？

Question

在jQuery documentation for the child selector我看到了这个注释:

Note: The $("> elem", context) selector will be deprecated in a future release. Its usage is thus discouraged in lieu of using alternative selectors.

我一直使用这个模式，通常是这样的:

$nodes.find('> children[something=morecomplicated] > somethingelse');

但是，我不明白他们指的“替代选择器”是什么。 编写遍历上下文节点的直接子节点的选择器的正确方法是什么？作为奖励，任何人都可以解释为什么这是贬值的吗？每个人提供的所有替代方案看起来都非常丑陋。

以下是一些不起作用的东西:

// does not guarantee that '.child' is an immediate child
$nodes.find('.child > .grandchild');

// this will return empty array in recent jQuery
// and will return full list of children in older jQuery
$nodes.children('.child > .grandchild');

// Anything like this which forces you to split up the selector.
// This is ugly and inconsistent with usual selector ease-of-use,
// and is a non-trivial conversion for long or complex selectors.
$nodes.children('.child').children('.grandchild');
// After all, no one would ever recommend
$nodes.find('.this').children('.that');
// instead of
$nodes.find('.this > .that');

Answer 1

他们说的原因:

Note: The $("> elem", context) selector will be deprecated in a future release. Its usage is thus discouraged in lieu of using alternative selectors.

是由于选择器中的逗号后跟上下文。例如。 $("> elem") 很好，但是 $("> elem", context) 将被弃用。

$("> elem", context) 与 $(context + "> elem") 相同。

正确的子孙获取方式是

$("elem").children('.child').children('.grandchild');

或

context.children('.child').children('.grandchild');

或

context.find('> .child > .grandchild');