Как выбрать элементы, у которых нет определенного дочернего элемента, с помощью JQuery

Question

Существует ли селектор JQuery для выбора всех элементов, которые не имеют определенный дочерний элемент как прямой дочерний элемент?Например:

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

Я хочу выбрать только <p> s как первый (без дочернего элемента <div>). Возможно ли это?

Дополнительная информация: На самом деле я пытаюсь вставить <div> во все те <p>, у которых их нет, с помощью выражения вроде этого:

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

Но это добавит дополнительный <div> ко второму <p>.

Answer 1

Вы можете попробовать:

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

Answer 2

Вы можете комбинировать селектор :has() ^{[документы]} с функцией not ^{[документы]} , чтобы добиться этого :

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

Кроме того, вы можете использовать один селектор, используя :not() ^{[документы]} селектор:

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

Вы можете использовать либо взаимозаменяемо, но IIRC, первый быстрее.

Посмотрите это в действии на jsFiddle .

Обратите внимание, что div является элементом уровня блока, а p - нет. Это означает, что недопустимым является HTML, div вложенный в p.

Answer 3

структурные элементы внутри текстовых элементов кажутся мне очень нечистыми, но если вы настаиваете;)

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

вот демо: http://jsfiddle.net/NTpES/3/

Answer 4

Попробуйте это:

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

Answer 5

Это похоже на работу: $('p:not("p div")')