정리jQuery

jQuery API parent 메서드

jQuery, parent

선택자로 검색된 문서 객체의 태그 요소의 상위 요소(부모 요소)를 반환한다. 부가적으로 반환된 jQuery 객체에 다른 메서드나 속성을 사용할 수 있다.

parent() 메서드는 DOM 트리에서 요소의 바로 위의 부모(상위)를 탐색하고 일치하는 요소에서 새 jQuery 객체를 생성한다.이 메서드는 DOM 트리에서 한 단계 상위의 요소만 반환하는거를 제외하고는 .parents()메서드와 유사하다.

1
2
$("html").parent(); //상위 문서 객체 1개만 반환
$("html").parents();//상위 문서 객체 전부 다 반환

예제

p태그 선택자의 상위 요소 div 태그 중에 selected란 클래스가 있는 요소에 css를 적용

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>parent demo</title>
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>

<div><p>Hello</p></div>
<div class="selected"><p>Hello Again</p></div>

<script>
$( "p" ).parent( ".selected" ).css( "background", "yellow" );
</script>

</body>
</html>
Share