19. 반복문 예고

 

저번시간에 이어서 버튼을 클릭했을 때 웹페이지에 있는 모든 링크에 대해 style 속성의 값을 조절해서 밝게 바꾸도록 코드를 작성해도 되겠지만 , 링크가 1억개 라면 1억번의 반복적인 작업을 해야합니다.

그럼 코드의 양이 늘어나며, 유지보수가 매우 힘들어집니다.

이번시간엔 반복문을 배우기 위한 개요를 알아보자. 먼저 반복문을 적용한 결과부터 보여드리고, 반복문을 도입하기 위해 필요한 것들을 다음시간에 살펴 봅시다.

 

var alist = document.querySelectorAll('a');
var i = 0;
while(i< alist.length){
	alist[i].style.color = 'powderblue';
	console.log(alist[i]);
	i = i+1;
}

 

코드의 대략적인 내용은 이 웹페이지의 모든 <a> 태그를 가져온다음 , <a>태그 하나하나에 대해 반복적으로 powderblue 색상을 지정하는 것입니다. 이 코드를 이해하기 위해 필요한 부품들은 다음시간에 살펴볼 것입니다.