선택자

• $()팩터리 함수

       태그이름 : $('p')는 document내에서 모든 HTML단락요소(p요소)들을 얻어낸다.
       ID           : $('#some-id')는 document내에서 some-id라는 ID를 가지는 단일 요소를
                      가져온다.
       클래스    : $('.some-class')는 document 내에서 some-class라는 클래스 이름을 가진
                      모든 요소를 가져온다.

• CSS선택자

        $(document).ready(function(){
            $('#selected-plays > li').addClass('horizontal');
            $('#selected-plays li:not(.horizontal)').addClass('sub-level');
        });

        selected-plays를 ID값으로 가지는 요소의 자식(>)중에서 리스트 항목(li)에
        horizontal 클래스 CSS를 적용한다.
        selected-plays를 ID값으로 가지고 있는 요소의 자식이며,
        horizontal클래스로 가지고 있지 않은 리스트 항목에 sub-level클래스 CSS를 적용한다.

• XPath 선택자

        $('a[@title]') title속성을 가지고 있는 모든 링크를 선택

        $('div[ol]') ol요소를 포함하고 있는 모든 div요소를 선택

        jQuery1.1에서만 사용가능함

        jQuery1.2부터는 플러그인으로 제공

• 사용자정의 선택자

        $('div.horizontal:eq(1)') 

        horizontal클래스를 가지는 div집합 중에서 두번째 항목을 선택  

        $(document).ready(function(){

            $('tr:odd').addClass('odd');

            $('tr:even').addClass('even');

            $('td:contains("Henry")').addClass('hightlight');

        });      

        테이블에 홀수행에 odd클래스 CSS적용

        테이블에 짝수행에 even클래스 CSS적용

        Henry라는 텍스트를 포함한 셀에 hightlight클래스 CSS적용

• DOM 순회 메서드들

       $(document).ready(function(){

            $('th').addClass('table-heading');

            $('tr:not(:has(th)):even').addClass('even');

            $('tr:not(:has(th)):odd').addClass('odd');

            $('td:contains("Henry")').siblings().addClass('hightlight');

        });    

        헤대셀에 table-heading클래스 적용

        나머지 행에 대해 홀수, 짝수 행에 따라 다르게 css적용

        $('tr:odd:not(:has(th))')는 다름