JS - querySelector

김도영·2022년 4월 28일
0
post-thumbnail

querySelector() 란?

HTML 문서에서 입력한 선택자의 첫 번째 요소를 반환한다.

문법

document.querySelector('selector')
document.querySelector('.selector1')
document.querySelector('#selector2')

매개변수로 'selector'를 주었을 때, HTML 문서에서 'selector' 태그를 가진 요소들 중에서 첫 번째 요소를 반환한다.
id를 찾을 때는 앞에 #을 붙이고, 클래스 이름을 찾을 때는 앞에 .를 붙인다.

예제

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>안녕하세요!</title>
</head>
<body>
    <p class="selector">블록체인 개발</p>
    <p class="selector">블록체인 개발</p>
    <p class="selector">블록체인 개발</p>
    <script>document.querySelector('.selector').style.color = 'blue';</script>
</body>
</html>

profile
Blockchain Developer

0개의 댓글