For example we have this
<p></p>
<p></p>
<p><img src="" /></p>
<p></p>
How can we select all p elements and apply css styles into it except those with img child element?
The :empty CSS pseudo-class represents any element that has no children.
To select element that does not have specific class with JavaScript, we can use the document. querySelector method with the :not pseudoclass. const li = document. querySelector("li:not(.
The CSS child selector has two selectors separated by a > symbol. The first selector indicates the parent element. The second selector indicates the child element CSS will style.
Definition and UsageThe :nth-child(n) selector matches every element that is the nth child of its parent. n can be a number, a keyword (odd or even), or a formula (like an + b). Tip: Look at the :nth-of-type() selector to select the element that is the nth child, of the same type (tag name), of its parent.
css :not()
not supported to select except "has element" but you can do it with jQuery
$('p').not(":has(img)").css('background-color', 'yellow')
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<p>aa</p>
<p>aa</p>
<p>img<img src="" /></p>
<p>aa</p>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With