The jQuery :has() selector in jQuery is used to select all elements that have one or more elements inside of them, that match the specified selector.
Syntax:
$(":has(selector)")
Parameter: This selector contains a single parameter selector which is mandatory and used to specify the element to select. It is also required to accept any kind of selector.
Example 1: This example uses:has selector to select <h2> span element to create a solid green border.
HTML
<!DOCTYPE html>
< html >
< head >
< title >jQuery :has() Selector</ title >
< script src =
</ script >
< script >
$(document).ready(function () {
$("h2:has(span)").css("border", "solid green");
});
</ script >
</ head >
< body >
< center >
< h1 id = "geeks1" style = "color:green;" >
GeeksForGeeks
</ h1 >
< h2 id = "geeks2" >
< span >
jQuery :has() Selector
</ span >
</ h2 >
</ center >
</ body >
</ html >
|
Output:
Example 2: This example uses:has selector to select elements and create a border.
html
<!DOCTYPE html>
< html >
< head >
< title >jQuery :has() Selector</ title >
< script src =
</ script >
< script >
$(document).ready(function () {
$("body:has(h1, span)").css("border", "solid green");
});
</ script >
</ head >
< body >
< center >
< h1 id = "geeks1" style = "color:green;" >
GeeksForGeeks
</ h1 >
< h2 id = "geeks2" >
< span >
jQuery :has() Selector
</ span >
</ h2 >
</ center >
</ body >
</ html >
|
Output:
Last Updated :
06 Jul, 2023
Like Article
Save Article
Share your thoughts in the comments
Please Login to comment...