HTML DOM querySelector () 메소드
정의 및 사용
querySelector () 메서드는 지정된 CSS의 셀렉터에 일치하는 문서의 요소를 돌려줍니다.
참고 : querySelector () 메소드는 지정한 셀렉터에 일치하는 첫 번째 요소를 반환합니다. 당신이 모든 요소를 반환해야하는 경우, 대신 querySelectorAll () 메서드를 사용합니다.
더 많은 CSS 선택기, 우리의 방문하시기 바랍니다 CSS 선택기는 튜토리얼 과 우리의 CSS 선택기는 설명서를 참조 .
브라우저 지원
표의 수치는 상기 방법의 버전 번호를 먼저 지원 브라우저를 나타낸다.
| 방법 | |||||
|---|---|---|---|---|---|
| querySelector () | 4.0 | 8.0 | 3.5 | 3.1 | 10.0 |
문법
document.querySelector (CSS 선택기)
매개 변수 값
| 매개 변수 | 유형 | 기술 |
|---|---|---|
| CSS 선택기 | 현 | 해야합니다. CSS 선택기에서 하나 이상의 일치하는 요소를 지정합니다. 당신은 요소를 선택하는 등, 속성 값, 속성, 자신의 아이디, 클래스, 유형을 사용할 수 있습니다. 쉼표로 구분 된 여러 선택기, 내용은 일치하는 요소를 반환합니다. 팁 : 더 CSS 선택기를 들어, 우리의 참조하시기 바랍니다 CSS 선택기는 설명서를 참조 . |
기술 세부 사항
| DOM 버전 : | 선택기 레벨 1 문서 객체 |
|---|---|
| 반환 값 : | 일치하는 첫 번째 요소는 CSS 셀렉터를 지정했습니다. 발견되지 않는 경우는, null를 돌려줍니다. 지정하면 잘못된 선택 SYNTAX_ERR 예외가 발생합니다. |
더 많은 예제
예
다음 예는 선택기 복수의 사용을 보여준다.
당신이이 선택기를 선택한다고 가정 <H2>와 <H3> 요소입니다.
다음 코드의 첫 번째 <H2> 요소는 문서의 배경 색상을 추가 할 것이다 :
<H2>은 H2 요소 </ H2>
<H3>은 H3 요소 </ H3>
document.querySelector ( "H2, H3")을 style.backgroundColor = "빨간색";
<H3>은 H3 요소 </ H3>
document.querySelector ( "H2, H3")을 style.backgroundColor = "빨간색";
»시도
문서 <H3> 요소 인 경우에는, <H2> 요소 전에, <H3> 요소는 배경 색을 지정하는 설정한다.
<H3>은 H3 요소 </ H3>
<H2>은 H2 요소 </ H2>
document.querySelector ( "H2, H3")을 style.backgroundColor = "빨간색";
<H2>은 H2 요소 </ H2>
document.querySelector ( "H2, H3")을 style.backgroundColor = "빨간색";
»시도
관련 페이지
자바 스크립트 참조 설명서 : 요소 .querySelector ()