如何使用JQuery选择没有特定子元素的元素

Question

是否有一个JQuery选择器来选择所有没有某个子元素作为直接子元素的元素？例如:

<p>
    text in paragraph
</p>
<p>
    <div>text in div</div>
</p>

我想只选择<p>第一个(没有<div>孩子).这可能吗？

进一步的信息:实际上我正试图通过这样的表达式<div>将所有那些<p>没有的人插入:

$('p').wrapInner('<div />')

但这会增加<div>第二个<p>.

Answer 1

你可以尝试:

$("p:not(:has(>div))")

Answer 2

您可以将:has()^[docs]选择器与not函数^{[docs]结合使用}来实现此目的:

$("p").not(":has(div)").wrapInner("<div/>");

或者,您可以使用:not()^[docs]选择器使用单个选择器:

$("p:not(:has(div))").wrapInner("<div/>");

您可以互换使用,但IIRC,第一个更快.

在jsFiddle中查看它的实际操作.

请注意,这div是一个块级元素,p而不是.这意味着div嵌套在一个无效的HTML 中p.