<form id="form1">
<fieldset>
<legend>
문서 배경색을 선택하세요.
</legend>
<label>
<input type="radio" value="white" name="rb" checked>
흰색
</label>
<label>
<input type="radio" value="yellow" name="rb">
노랑
</label>
<label>
<input type="radio" value="blue" name="rb">
블루
</label>
<label>
<input type="radio" value="black" name="rb">
검정
</label>
</fieldset>
</form>
<script>
var rb = document.getElementsByName("rb");
for (let i=0; i<rb.length; i++) {
rb[i].onchange = function() {
document.body.bgColor = rb[i].value;
}
}
</script>
- name=”rb”로 정의했기 때문에 rb라는 배열 생성
- 제어문 안의 function에서도 사용 가능하도록 자료형은 let으로 정의
- for문으로 돌면서 rb[i] 버튼 값이 변화하는 순간 <body> bgColor 변경
bgColor를 속성으로 가지는 태그는 <body>, <table>, <tr>, <th>, <td> 등이 있다. 나머지는 css의 backgroundColor로 적용해야한다.
💗 개발 공부하는 블로그입니다. 틀리거나 문제될게 있다면 코멘트 부탁드립니다. 👉👈