jQuery Selector (선택자)

jQuery의 장점 중 하나가 html의 DOM요소에 쉽게 접근하는게 큰 장점이라고 생각한다.

DOM요소에 접근을 하기위해서는 Selector 문법을 필수로 숙지하여야한다.

jQuery Selector은 CSS Selector 의 문법을 그대로 사용했기 때문에 CSS에 강한 사람은 그대로 사용가능하겠지만 

모르는 사람은 필히 숙지하도록 하자.

1. 단일 요소 가져오기

    -  $('태그명')   :   태그명에 속하는 모든 요소를 가져온다.

   ex) alert( $("div").length);  //div의 갯수를 확인한다.

2. 다중 요소 가져오기 (콤마로 구분)

    -  $('태그명,태그명')   :   태그명에 속하는 모든 요소를 가져온다.

   ex) alert( $("div,span,p,a").length);  //div,span,p,a 의 갯수를 확인한다.

3. id가 지정된 요소 가져오기

    -  $('#아이디')   :   아이디가 지정된 요소를 가져온다.

   ex) <span id="lblName">홍길동</span>

         alert( $("#lblName").html());  //홍길동 출력

4. class가 지정된 요소 가져오기

    -  $('.클래스명')   :   클래스명이 지정된 요소를 가져온다.

5. 특정 태그에서 특정 class가 선언된 요소 가져오기

   - $("태그명.클래스명")

  ex) $("div.content")  : div 태그에 content 클래스가 지정된 요소

6. 자식요소 가져오기(공백으로 구분)

  - $(부모 자식)

ex) $(table tr)  : table태그의 tr의 모든 요소

7. 속성 값으로 가져오기( [] 대괄호로 구분)

 - $(태그명[속성명])

ex)  $("a[href]")   :  a 태그중 href가 정의된 모든 요소

      $("a[href='kkams.net']")   :  a 태그중 href가 kkams.net 으로  정의된 모든 요소 

8. 입력 요소 가져오기

 - $(":input")   :  input, select, radio 등 모든 입력요소 

9. 특정요소의 내용에 특정값이 포함된 요소 가져오기

 - 태그명:contains("특정값")  :특정값은 대소문자를 구분한다.

ex) $("div:contains('홍길동')")  :  홍길동이 포함된 모든 div 요소

10. list계열의 짝수/홀수 요소 가져오기

 - :even, : odd

ex) $('ul li:even')  // ul의 li 자식중 짝수 요소

     $('ul li:odd')  // ul의 li 자식중 홀수 요소

11. 첫번째/ 마지막 요소 가져오기

 - :first , :last   

ex) $("div:first")   // body에 선언된 첫번째 div  

     $("div:last")   // body에 선언된  마지막  div

     $("div:nth(n)")   // body에 n번째에 선언된 div

12. 첫번째 자식/ 마지막 자식 요소 가져오기

 - : first-child  ,   :list-child

ex) $("li:first-child")   // li의 첫째 자식

     $("li:last -child")   // li의 마지막 자식

   $("li:nth-child(n)")    // li의 n 번째 자식

   

13. 정규식으로 요소 가져오기

태그명[속성명]	특정 속성명를 가지는 모든 요소
태그명[속성명=속성값]	속성명이 특정 속성값과 일치하는  모든 요소
태그명[속성명^=속성값]	속성명이 특정 속성값으로 시작하는  모든 요소
태그명[속성명$=속성값]	속성명이 특정 속성값으로 끝나는  모든 요소
태그명[속성명*=속성값]	속성명이 특정 속성값을 포함하고 있는  모든 요소

더 자세한 정보를 원한다면 아래 사이트를 참고하자.

http://www.w3.org/TR/css3-selectors/

http://api.jquery.com/category/selectors/

http://kogangdon.thoth.kr/?document_srl=1965052