jQuery기초 계층(Hierarchy) 선택자

***계층(Hierarchy) 선택자

*선택자
ancestor descendant : 조상(ancestor)에 속한 자손(descendant)을 찾는 선택으로, 하위의 자손 태그가 몇 단계 아래의 계층에 있느냐와 상관없이 모두 선택한다.
parent > child : parent에 속해 있는 <child> 태그를 선택한다.
prev + next : 현재 선택된 <prev> 태그를 기준으로 바로 뒤에 오는 첫 번째 형제 태그를 선택한다.
prev ~ siblings : 현재 선택된 <prev> 태그를 기준으로 바로 뒤부터 형제 태그를 모두 선택한다.

$("div#container li") // id속성이 #container인 <div> 태그의 자손 태그 중 <li> 태그를 모두 선택
$("div > p") //<div> 태그의 자식 태그 중(자손 태그는 포함하지 않음) <p> 태그를 선택
$("#first + li") //id속성이 first인 노드를 찾은 후, 바로 그 다음 형제(li) 노드를 선택
$("#second ~ li") // id속성이 second인 노드를 선택한 것을 기준으로 다움에 오는 형제들을 모두 선택. 단, 찾을 li 태그는 모두 같은 부모를 갖고 있는 형제 관계인 것만 찾는다. siblings라는 이름에서 알 수있 듯이, 복수 형재를 선택한다.