jQuery API - 선택자
- "*" : 전체 선택자
속성 선택자
- [name] : name 속성이 있는 요소를 선택
- [name = "value"][name2 = "value2"] : name 속성의 값이 value이고 name2 속성의 값이 value2 인 요소를 선택
- [name = "value"] : name 속성의 값이 value인 요소를 선택한다.
- [name != "value"] : name 속성의 값이 value가 아닌 요소를 선택한다.
- [name ^= "value"] : name 속성의 값이 value로 시작하는 요소를 선택한다.
- [name |= "value"] : name 속성의 값이 value 이거나 value로 시작하는 요소를 선택한다.
- [name *= "value"] : name 속성의 값에 value가 들어 있는 요소를 선택한다.
- [name ~= "value"] : name 속성의 값이 value를 포함하는, 쉼표로 구분된 문자열 요소를 선택.
- [name $= "value"] : name 속성의 값이 value로 끝나는 요소를 선택한다.
태그 선택
- div : 태그명이 div인 모든 Element 선택
- div p : div 요소의 자식 요소중 태그명이 p인 요소 선택
- div, p : div 요소와 p 요소를 선택
- div > p : div 요소의 바로아래 자식 요소중 태그명 p인 요소 선택
- div + p : div의 형제 요소로 바로 다음에 나오는 요소 p인 요소 선택
- div ~ p : div의 형제 요소로 다음에 나오는 모든 요소 p인 요소 선택
- div:has(p) : 태그명이 p인 자손을 하나 이상 가지는 div 요소 선택
- div.code : 클래스명 code를 가지는 모든 div 요소 선택
- div#name : id가 name인 div 요소 선택
- div[A] : 속성 A를 가지는 모든 div 요소 선택
- div[A=B] : 값이 B인 A 속성 값을 가진 div 요소 선택
- div[A^=B] : 값이 B로 시작하는 값인 A 속성을 가진 div 요소 선택
- div[A$=V] : 값이 V로 끝나는 값인 A 속성을 가진 div 요소 선택
- div[A*=V] : 값에 V를 포함하는 값인 A 속성을 가진 div 요소 선택
선택자
- :animated : 움직이는 요소를 선택한다.
- :header() : <h1>, <h2>, <h3> 등 제목 요소를 선택한다.
- :input : input, textarea 모든 입력 컨트롤 선택
- :text : <input type="text"> 선택
- :button : <input type="button"> 선택
- :radio : <input type="radio"> 선택
- :checkbox : <input type="checkbox"> 선택
- :password : <input type="password"> 선택
- :file : <input type="file"> 선택
- :hidden : <input type="hidden"> 선택
- :image : <imput type="image"> 선택
- :submit : <input type="submit"> 선택
- :reset : <input type="reset"> 선택
- :selected : <select>의 <option selected> 를 선택한다.
- :checked : <input type="checkbox"> <input type="radio">의 체크된 요소를 선택한다.
- :contains() : 해당 인자를 가지고 있는 요소 선택 ; $('div:contains("text")') // div 요소중 "text"를 포함한 요소
- :visible : 눈에 보이는 요소 선택
- :enabled : 활성화된 요소 선택
- :disabled : 비활성화된 요소 선택
- :empty : 해당 요소가 비어있는 요소 선택 (text도 포함)
- :odd : 홀수 요소 선택
- :even : 짝수 요소 선택
- :parent : 부모요소 선택
- :first : 첫번째 요소 선택
- :first-child : 첫번째 자식요소 선택
- :last : 마지막 요소 선택
- :last-child : 마지막 자식요소 선택
- :nth-child() : 자식 요소 집합에서 인자의 위치한 자식을 선택 ; $('li:nth-child(1)') // <li>의 첫번째 자식요소를 찾는다. (index : 1, 2, 3)
- :eq() : 인자의 순번에 있는 요소를 선택 ; $('td:eq(2)") // td 집합중 세번째 요소를 선택 (index : 0, 1, 2)
- :only-child : 형제가 없는 요소를 선택
- :gt() : 인자보다 큰 요소 선택 ; $(":gt(index)") // index 값보다 큰 요소 선택
- :lt() : 인자보다 작은 요소 선택 ; $(":lt(index)") // index 값보다 작은 요소 선택
- :has() : 인자요소를 가지고 있는 요소를 선택 ; $('div:has(p)') // p를 자식으로 가지고 있는 div를 선택
- :not() : 인자의 조건이 아닌 요소를 선택 ; $(':not(div)') // div 가 아닌 요소를 선택
- :focus : focus 상태 요소 선택
출처:http://hyeonstorage.tistory.com/
댓글 0
번호 | 제목 | 글쓴이 | 날짜 | 조회 수 |
---|---|---|---|---|
공지 | 말그대로 잡동사니 팁 유틸등을 정리 해보려합니다 | 공수래 | 2013.03.15 | 2726 |
16 | flexGrid 메소드및 프로퍼티 정리 | 공수래 | 2023.10.19 | 119 |
15 | crossdomain.xml 작성법 | 공수래 | 2015.05.07 | 4931 |
14 | Daz 3D Tutorial-3PointLightSetup | 공수래 | 2014.10.26 | 983 |
» | [jQuery] jQuery API - 선택자 | 공수래 | 2014.09.25 | 835 |
12 | jQuery API - 제어 (선택, 삽입, 삭제, 변경, 변환, 확장) | 공수래 | 2014.09.25 | 6449 |
11 | 쿠키생성 및 사용하기 | 공수래 | 2014.09.14 | 660 |
10 | keygen | 공수래 | 2013.09.07 | 1917 |
9 | jquery waterwheel Carousel 플러그인 이미지 아래에 텍스트 넣기 | 공수래 | 2013.08.12 | 4607 |
8 | jQuery 메소드 | 공수래 | 2013.08.02 | 2351 |
7 | 엘리먼트에 관련된 프로퍼티 메서드 | 공수래 | 2013.08.02 | 1490 |
6 | jQuery에서 제공하는 엘리먼트와 관련된 프로퍼티와 메서드 | 공수래 | 2013.08.02 | 7778 |
5 | 웹폰트 개념 | 공수래 | 2013.08.01 | 1280 |
4 | .outerWidth( [includeMargin] ) | 공수래 | 2013.07.26 | 1992 |
3 | daz3d UberEnvironment 라이트 | 공수래 | 2013.07.12 | 1410 |
2 | Jquery 글자수 체크 | 공수래 | 2013.03.16 | 2378 |
1 | Nginx로 서버를 돌릴 경우 1M 파일 제한 | 공수래 | 2013.03.15 | 2324 |