Селектор has
Селектор :has
выбирает элементы,
которые содержат хотя бы один элемент
по заданному селектору, необязательно
непосредственного потомка.
Так как :has
не относится к CSS спецификации,
то для улучшения производительности в современных
браузерах лучше вместо него использовать
$("ваш css-селектор").has(селектор/DOM элемент)
.
Синтаксис
Так мы выбираем элементы:
$(':has(селектор)');
Так мы выбираем элементы, если нужна непосредственная вложенность селектора:
$(':has(>селектор)');
Пример
Давайте выберем только те абзацы, у которых внутри есть
тег b
и
поставим им в конец текст '!!!'
:
<p>text</p>
<p>text</p>
<p><b>bold</b> text</p>
<p><b>bold</b> text</p>
$('p:has(b)').append('!!!');
HTML код станет выглядеть так:
<p>text</p>
<p>text</p>
<p><b>bold</b> text!!!</p>
<p><b>bold</b> text!!!</p>