5. jquery Selector [ :has()] - 특정요소를 포함하고있는 요소를 선택하는 선택자

문법

$(":has()")

예를 들어

1. $("p:has(span)")

1. p태그안에 span태그가 있는 p태그를 선택합니다.

예제 코드

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<html>
	<head>
		<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
		<title>Home</title>
	</head>
	<script type="text/javascript">
    $(document).ready(function(){
      $("p:has(span)").css("color", "red");
    });
	</script>
	<body>
		<p>
			<span>Melon</span>
			<a>Peach</a>
		</p>
		<p>
			<a>Melon</a>
			<a>Peach</a>
		</p>
	</body>
</html>

p태그안에 span태그가 있는 p태그를 선택합니다.

그럼 p태그안에 span태그가 있어서 a태그도영향을 받게되어 color이 빨간색으로 나오게됩니다.

실행 테스트