JQuery 선택자(Selector)
JQuery 선택자입니다. 돔(DOM) 구조에서 여러가지 조건에 따라 선택할 수 있는 선택자입니다. 전체를 선택하거나, 특정 ID를 선택하거나 태그 또는 클래스를 선택할 수 있는 조건과 계층에 따라 선택할 수 있는 선택자로 구분되어 있습니다.
계층구조의 선택자는 특정 요소를 지정하는 것이 아니라, 자식(child) 요소를 선택하거나 다음에 오는 요소를 선택해 지정할 수 있습니다.
$('*') [모든 요소를 선택합니다.]
$('body > *') [body 하위의 모든 요소를 선택합니다.]
$('#userinput') [id속성값이 userinput인 요소를 선택합니다.
$('table') [문서 내 table 요소들을 선택합니다.]
$('.section') [class 속성의 값이 section인 요소들을 선택합니다.]
$('.section1.section2') [class 속성의 값이 section1와 section2 둘 다 포함되는 요소들을 선택합니다.]
$('.parent > .child') [class 속성값이 parent 인 요소의 자식중에 class 속성값이 .child인 요소들을 선택합니다.]
$('.parent .child') [class 속성값이 parent 인 요소의 하위에 있는 class 속성값이 .child인 모든 요소들을 선택합니다.]
$('#prev + *') [id속성값이 prev인 요소의 바로 다음으로 요소 하나만 선택]
$('#first ~ *') [id 값이 first인 요소의 다음으로 존재하는 모든 형제 요소들을 선택]
- 달러사인($)은 기본적으로 사용한다.
'Web Development > JavaScript' 카테고리의 다른 글
특정 페이지 및 카테고리의 HTML 구조를 변환하기 (IF조건문) (0) | 2021.07.17 |
---|---|
[JavaScirpt] 자바스크립트로 오늘 날짜 출력하기 (0) | 2021.07.17 |
[JavaScript] 팝업 창 오늘 그만 보기 (0) | 2021.07.17 |
[jQuery] Create Customizable Scalable Math Graphs With jQuery smartGraph(스마트 그래프) (0) | 2021.07.17 |
JavaScript event keycode 목록 (0) | 2021.07.17 |
[JavaScript] 부드러운 스크롤 (0) | 2021.07.17 |
jQuery를 사용하여 페이지로드시 자동 클릭 단추 요소 (0) | 2021.07.17 |
매우 심플한 슬라이더(Very Simple Slider) (0) | 2021.07.17 |