블로그 이미지
푸른_바람

Rss feed Tistory

셀렉터에 해당되는 글 2건

IT/Tech 2010/07/30 08:30

jQuery가 지원하는 고급 위치 기반 셀렉터

jQuery가 지원하는 고급 위치 기반 셀렉터. DOM에서 위치를 기반으로 엘리먼트를 선택한다.
 셀렉터 설명
 :first  페이지에서 처음으로 일치하는 엘리먼트.
 li a:first는 리스트 아이템의 첫 번째 링크를 반환한다.
 :last  페이지 마지막으로 일치하는 엘리먼트.
 li a:last는 리스트 아이템의 마지막 링크를 반환한다.
 :frist-child 첫 번째 자식 엘리먼트.
 li:first-child는 각 리스트의 첫 번째 아이템을 반환한다.
 :last-child  마지막 자식 엘리먼트.
 li:last-child는 각 리스트의 마지막 아이템을 반환한다.
 :only-child 형제가 없는 모든 엘리먼트를 반환한다.
 :nth-child(n) n번째 자식 엘리먼트.
 li:nth-child(2)는 각 리스트의 두 번째 리스트 아이템을 반환한다.
 :nth-child(even|odd) 짝수 또는 홀수 자식 엘리먼트.
 li:nth-child(even)은 각 목록의 짝수 번째 자식 엘리먼트를 반환한다.
 :nth-child(Xn+Y) 전달된 공식ㅇ 따른 n번째 자식 엘리먼트.
 Y는 0인 경우 생략 가능하다.
 li:nth-child(3n)은 3의 배수 번째 아이템을 반환한다.
 li:nth-child(5n+1)은 5의 배수 + 1 번째 아이템을 반환한다.
 :even / :odd 페이지 전체의 짝수/홀수 번째 엘리먼트. li:even은 모든 짝수 번째 아이템을 반환한다.
 :eq(n) n번째로 일치하는 엘리먼트 (0 부터 시작)
 :gt(n) n번째 엘리먼트(포함되지 않음) 이후의 엘리먼트와 일치
 :lt(n) n번째 엘리먼트(포함되지 않음) 이전의 엘리먼트와 일치

* 다른 셀렉터는 0부터 시작되지만 n번째 자식 셀렉터는 1부터 시작된다.
n번째 자식 셀렉터는 CSS와 호환성을 유지하려고 인덱스를 1부터 시작한다. 하지만 jQuery 정의 셀렉터는 법용 프로그래밍 규약에 따란 인덱스를 0부터 시작한다.

jQuery in Action (프로그래밍 jQuery) : p28

'IT > Tech' 카테고리의 다른 글

PHP Fatal error: Allowed memory size of 8388608 bytes exhausted  (0) 2010/08/06
javascript 이미지에 그레이스케일(grayscale) 적용  (0) 2010/07/31
jQuery가 지원하는 고급 위치 기반 셀렉터  (0) 2010/07/30
jQuery가 지원하는 기본 CSS 셀렉터  (0) 2010/07/29
jquery bookmarklet 생성기  (0) 2010/07/20
LAMPP & 버추얼호스트 & XDebug  (0) 2010/07/20
CSS, JQuery, selector, 셀렉터
트랙백 0, 댓글 0
IT/Tech 2010/07/29 08:30

jQuery가 지원하는 기본 CSS 셀렉터

셀렉터 설명
*  모든 엘리먼트와 일치
E  태그켱이 E인 모든 엘리먼트와 일치
E F  E의 자손이면서 태그명이 F인 모든 엘리먼트와 일치
E>F  E의 바로 아래 자식이면서 태그명이 F인 모든 엘리먼트와 일치
E+F  E의 형제 엘리먼트로 바로 다음에 나오는 엘리먼트 F와 일치
E~F  E의 형제 엘리먼트로 다음에 나오는 모든 엘리먼트 F와 일치
E:has(F)  태크명이 F인 자손을 하나 이상 가지는 태그명이 E인 모든 엘리먼트와 일치
E.C  클래스명 C를 가지는 모든 엘리먼트 E와 일치. E의 생략은 *.C와 동일함
E#I  아이디가 I인 엘리먼트 E와 일치. E의 생략은 *#I와 동일함
E[A]  어트리뷰트 A를 가지는 모든 엘리먼트 E와 일치
E[A=V]  값이 V인 어트리뷰트 A를 가지는 모든 엘리먼트 E와 일치
E[A^=V]  값이 V로 시작하는 어트리뷰트 A를 가지는 모든 엘리먼트 E와 일치
E[A$=V]  값이 V로 끝나는 어트리뷰터 A를 가지는 모든 엘리먼트 E와 일치
E[A*=V]  값에 V를 포함하는 어트리뷰터 A를 가지는 모든 엘리먼트 E와 일치

jQuery in Action (프로그래밍 jQuery) : p27

'IT > Tech' 카테고리의 다른 글

javascript 이미지에 그레이스케일(grayscale) 적용  (0) 2010/07/31
jQuery가 지원하는 고급 위치 기반 셀렉터  (0) 2010/07/30
jQuery가 지원하는 기본 CSS 셀렉터  (0) 2010/07/29
jquery bookmarklet 생성기  (0) 2010/07/20
LAMPP & 버추얼호스트 & XDebug  (0) 2010/07/20
리눅스 관리를 위해서 알아햐할 모니터링 툴 20  (0) 2010/07/15
CSS, selector, 셀렉터
트랙백 0, 댓글 0
1
TOTAL 246,630 TODAY 8