jQuery('ancestor descendant') 는 부모(ancestor)에 속한 자식(descendant)를 찾는 선택자입니다.
원문 링크 
http://api.jquery.com/descendant-selector/
개요 : 자식요소를 찾는 선택자입니다.
- jQuery('ancestor descendant')
ancestor 는 '조상, 부모' 의 뜻입니다. descendant 는 '후손, 자식' 의 뜻이죠. 아마 고딩2년 정도 수준의 단어 였던걸로 기억합니다. 전 구글 사전으로 검색했습니다. 쿨럭;; 한글로 된 도스가 있었다는 얘기는 들었는데, 영어만 잘 하면 이 공부도 좀 더 수월해 지지 않나 생각해 봅니다.
단어의 뜻만 알아도 이 선택자의 역할이 무엇인지 와 닿습니다. 부모 요소에 속한 자식 요소들을 선택해 주는 요소입니다. 자식 요소는 직계, 손주, 증손주 들과 같이 모든 후손을 망라합니다.
예 제
form 태그에 속한 input 태그들을 찾아서 파란색 점선으로 표시합니다.
<!DOCTYPE html>
<html>
<head>
<style>
body { font-size:14px; }
form { border:2px green solid; padding:2px; margin:0;
background:#efe; }
div { color:red; }
fieldset { margin:1px; padding:3px; }
</style>
<script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>
<body>
<form>
<div>Form is surrounded by the green outline</div>
<label>Child:</label>
<input name="name" />
<fieldset>
<label>Grandchild:</label>
<input name="newsletter" />
</fieldset>
</form>
Sibling to form: <input name="none" />
<script>$("form input").css("border", "2px dotted blue");</script>
</body>
</html>미리보기
위 내용을 보시면 form 태그 안에 있는 모든 하위 요소들 중에 input 에 해당하는 요소들은 그 깊이와는 상관없이 모두 영향을 받는 것을 볼 수 있습니다. 한번 부모는 영원한 부모라는 게 되나요? 이런저런 이유로 객체는 사람에게도 적용되는 개념인가 봅니다. 쿨럭~
이 선택자도 활용도가 꽤 있어 보입니다. 잘 익혀 두셨다가 유용하게 사용하세요~~
그럼 즐프하세요.
※ 본 예제는 http://www.jquery.com 에 있는 내용임을 밝힙니다.
'프로그래밍 > jQuery' 카테고리의 다른 글
| jQuery API 정복 - input file 찾기 : jQuery(':file') (0) | 2011.01.29 |
|---|---|
| jQuery API 정복 - 리스트 짝수,홀수 찾기 : jQuery(':even') (2) | 2011.01.28 |
| jQuery API 정복 - 인덱스로 요소 찾기 : jQuery(':eq(index)') (6) | 2011.01.28 |
| jQuery API 정복 - 사용 불가 상태 선택하기 : jQuery(':disabled') (2) | 2011.01.28 |
| jQuery API정복 - 특정 단어 포함 요소 선택하기 : jQuery(':contains(text)') (6) | 2011.01.27 |
| jQuery API 정복 - 클래스명으로 선택하기 : jQuery('.class') (7) | 2011.01.27 |
| jQuery 쉽게하기 - API 깨부시기, 선택자(Selector) : 하위 요소 선택 ("parent > child") (8) | 2011.01.27 |
| jQuery 쉽게하기 - API 깨부시기, 선택자(Selector) : 체크된 체크박스만 알아내기 (4) | 2011.01.26 |