본문 바로가기

JavaScript ◡̈/inflearn JavaScript

[WEB2 - JavaScript] Lecture 23. 배열과 반복문의 활용

 

 

 

인프런 23강 "배열과 반복문의 활용"

 

 

 

이전 강의에서 학습한 배열과 반복문을 활용하여 night_day 실습에 활용하는 연습

 

- querySelector('a') 를 사용하면, a태그 하나만 가져오기 때문에 검색해보았을 때에, 

  검색하는 태그에 해당하는 것들을 모두 가져오고 싶을 때에는 document.querySelectorAll('a') 사용해야 함

    - developer.mozilla.org/ko/docs/Web/API/Document/querySelectorAll 참고

    - 결과는 정확하게 말하면 배열은 아니지만, 배열의 형태로 가져온다고 할 수 있음

    - 예를 들어 결과를 list 이름의 배열에 저장한다고 하면, list.length를 통해 배열 원소의 개수 파악 가능

 

 


 

 

<실습 코드 내용 정리>

 

    - line 10 : target 변수에 첫 번째 'body' 태그를 저장

    - line 16-22 : 새로 추가한 내용

        - 모든 'a' 태그를 가져와서 alist라는 배열에 저장

        - nodeList 형태로 저장됨

        - console.log 명령 활용하여 alist 배열의 원소 개수 만큼 while문 반복하여 배열에 저장된 내용 출력 해주며, 

            - night 모드에는 powderblue, day 모드에는 blue로 색상 변경해줌