1. Selector
1. 직접 선택자
- 전체 선택자: DOM의 모든 태그 선택. $("*")
- 아이디 선택자: 해당 아이디명을 가지고 있는 태그 선택. $("#아이디")
- 클래스 선택자: 해당 클래스명으로 되어있는 태그 선택. $(".클래스명")
- 태그 선택자: 해당 태그들 모두 선택. $("태그명")
- 그룹 선택자: 여러 개의 선택자를 묶어서 선택. $("선택자1, 선택자2, ..., 선택자n"). 선택자n에는 아이디, 클래스, 태그 선택자 등 다양한 선택자들을 넣을 수 있다.
2. 관계 선택자
- 선택자.parent(): 선택자의 부모 요소 선택
- $("기준 선택자"): 기준이 되는 태그의 모든 하위 태그 중에 선택자에 해당되는 태그들 모두 선택
- 선택자.children(), $("기준 > 선택자"): 기준이 되는 태그의 바로 하위 태그 중에 선택자에 해당되는 모든 태그 선택
- 선택자.prev(): 선택자의 형제 중 바로 앞 태그 선택
- 선택자.next(): 선택자의 형제 중 바로 뒤 태그 선택
- 선택자.siblings(): 모든 형제 태그 선택
3. 탐색 선택자
- 선택자.first(), $("선택자:first"): 선택된 태그들 중 첫 번째 태그를 선택
- 선택자.last(), $("선택자:last"): 선택된 태그들 중 마지막 태그 선택
- 선택자.eq(index), $("선택자:eq(index)"): 선택된 태그 중 지정한 인덱스에 해당하는 태그 선택
4. 속성 탐색 선택자
- $("선택자[속성]"): 해당 속성을 가지고 있는 태그 선택
- $("선택자[속성=속성값"]): 해당 속성의 값이 속성값과 동일한 태그 선택
- $(":selected"): 드롭다운 목록 중 seleted된 태그 선택
- $(":checked"): checkbox, radio 중 선택된 태그만 선택
5. 선택자와 함께 사용하면 편리한 메소드
- 선택자.is(상태(:checked, :selected, ...)): 선택된 태그의 상태값을 확인하는 메소드. true, false 리턴.
- 선택자.each(콜백함수), $.each("선택자", 콜백함수): 선택자가 여러개의 태그를 선택했을 때 하나씩 순회하면서 콜백함수를 실행
728x90
'네이버클라우드 캠프 5기 > 학습내용 정리' 카테고리의 다른 글
50. Jquery - Event (0) | 2023.05.26 |
---|---|
49. Jquery - method (0) | 2023.05.26 |
47. Jquery - Jquery란? (0) | 2023.05.26 |
46. JavaScript - ES6 (0) | 2023.05.26 |
45. JavaScript - method and event (0) | 2023.05.26 |