[ Java Script ] document.getElementById
2022. 2. 21. 20:50ㆍJava Script
< 코드 >
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>document.getElementsByTagName</title>
<script type="text/javascript">
var color=["red","orange","yellow","lightgreen","cyan","indigo","hotpink"];
function change(){
var eles=document.getElementsByTagName("li");
console.log(eles);
for(var i=0;eles.length;i++){
eles[i].style.backgroundColor=color[i];
}
}
</script>
</head>
<body>
<button onclick="change()">화면변경</button>
<ul>
<li>리스트1</li>
<li>리스트2</li>
<li>리스트3</li>
<li>리스트4</li>
<li>리스트5</li>
<li>리스트6</li>
<li>리스트7</li>
</ul>
</body>
</html>
'Java Script' 카테고리의 다른 글
[ Java Script ] document.getElementsByTagName (0) | 2022.02.21 |
---|---|
[ Java Script ] DOM 활용하여 폼 작성하기 (0) | 2022.02.21 |
[ Java Script ] 마우스 이벤트 활용하여 색 변경 하기 (0) | 2022.02.21 |
[ Java Script ] D-day 계산 프로그램 만들기 (0) | 2022.02.18 |
[ Java Script ] 숫자 업다운 게임 하기 (0) | 2022.02.18 |