ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [jQuery] jQuery 선택자 정리
    Dev/jQuery 2009. 11. 24. 15:33
    반응형

     $(document).ready(function () {
    	//$(document)와 $()는 같다.
    	$('.poem-stanza').addClass('emphasized'); 	//poem-stanza 클래스를 emphasized로 적용
    	$('#selected-plays > li').addClass('horizontal'); 		//selected-plays를 id값으로 가지는 요소의 자식중 리스트 항목(li) 검색
    	$('#selected-plays li:not(.horizontal)').addClass('sub-level'); 	//selected-plays를 id값으로 가지는 요소의 자식중 horizontal클래스를 가지지 않은 항목
    	$('a[href^="mailto:"]').addClass('mailto'); 	//a링크중 "mailto:"로 시작하는 
    	$('a[href$=".pdf"]').addClass('pdflink'); 	//a링크중 ".pdf"로 끝나는
    	$('a[href*="mysite.com"]').addClass('mysite'); //a링크중 "mysite.com" 이 들어있는
    	$('tr:odd').addClass('odd'); //tr요소의 홀수번째
    	$('tr:even').addClass('even'); //tr요소의 짝수 번째
    	$('tr').filter('even').addClass('even'); //tr요소의 짝수 번째
    	$('td:contains("쓰리")').addClass('highlight'); //td요소중 해당 단어("쓰리")가 포함되면..
    	$('td:contains("쓰리")').removeClass(); //td요소중 해당 단어("쓰리")가 포함되면 모든 클래스 삭제
    	//$('td:contains("쓰리")').siblings().addClass('highlight'); //td요소중 해당 단어("쓰리")가 포함된 이웃셀..
    	$('td:contains("쓰리")').next().addClass('highlight'); //td요소중 해당 단어("쓰리")가 포함된 바로다음 이웃셀..
    	//$('#my-element').get(0).tagName; 	//my-element를 id로 가지는 요소의 0 번째 태그이름
    	//$('#my-element')[0].tagName; 	//my-element를 id로 가지는 요소의 0 번째 태그이름(위에것과 같음)
    	$('tr:not(:has(th)):even').addClass('even');	//tr요소중 th요소를 가지지 않은것 중에 짝수일 경우 even클래스적용
    });
    


    모두다 정리는 못했지만.. 우선 이 만큼만.. ^^;

    추가...
    < 기본 필터 >

    :first 선택된 개체들 중 첫 번째 요소와 일치합니다.
    :last 선택된 개체들 중 마지막 요소와 일치합니다
    :not(selector) 괄호에 주어진 셀렉터와 일치되는 모든 요소를 제외합니다.
    :even 짝수 요소들과 일치합니다(0부터 시작)
    :odd 홀수 요소들과 일치합니다(0부터 시작)
    :eq(index) 인덱스에 해당하는 단일 요소와 일치합니다
    :gt(index) 주어진 인덱스보다 높은 인덱스를 갖는 모든 요소와 일치합니다
    :lt(index) 주어진 인덱스보다 낮은 인덱스를 갖는 모든 요소와 일치합니다
    :header 모든 헤더 요소들(h1, h2, h3 등)과 일치합니다
    :animated 현재 애니메이션이 동작중인 모든 요소와 일치합니다

    반응형
Designed by Tistory.