jQuery 자손 선택자와 후손 선택자

자손 선택자와 후손 선택자는 기본 선택자의 앞에 붙여 사용하며

기본 선택자의 범위를 제한한다.

body태그 바로 아래 있는 div태그를 자손이라 한다.

그리고 body태그의 아래에 있는 모든 문서 객체를

후손 이라고 한다.

라고 책에 쓰여져 있지만 역시 프로그래밍 이론 공부는

보면서 쳐보는게 제일 좋다.

<자손 선택자>

자손 선택자는 자손을 선택하는 선택자이며

요소A> 요소B의 형태로 사용된다.

아래에서는 body태그의 자식으로 범위를 한정해

전체가 선택된다.

크롬 개발자 도구로 확인을 해보면 div태그에만

css가 적용되어있다.

<후손 선택자>

후손 선택자는 이름 그대로 후손을 선택하며

요소A 요소B 의 형태로 사용하며

요소A의 후손으로 범위를 한정한다.

아래는 body 태그의 모든 후손을 선택한다.

크롬 개발자 도구로 확인을 하면

body 태그의 후손에 모두 스타일이 적용되있다.