Menu
Coddy logo textTech

querySelectorAll

Coddy의 JavaScript DOM 메서드 코스 레슨 — 13개 중 9번째.

querySelectorAll() 함수는 CSS와 유사한 선택자와 일치하는 모든 요소의 컬렉션을 반환하며, querySelector와 비슷하지만 일치하는 모든 요소를 한 번에 가져올 수 있게 해줍니다.

const elements = document.querySelectorAll(".other");

위 코드는 클래스 이름이 other인 모든 요소를 검색합니다.

challenge icon

챌린지

쉬움

두 개의 span을 포함하는 HTML 코드가 주어집니다.

JavaScript만을 사용하여, querySelectorAll 함수를 이용해 모든 엘리먼트의 스타일을 다음과 같이 변경하세요:

  1. backgroundColor"pink"로 변경
  2. border"1px solid red"로 변경

직접 해보기

<!DOCTYPE html>
<html>
    <body>
        <span class="error">Error 1</span>
        <span class="error">Error 2</span>
        <script src="script.js"></script>
    </body>
</html>

JavaScript DOM 메서드의 모든 레슨