1. 1번 : 각각의 함수 호출
<body>
<div style="border: 1px solid blue;">
<h1>배경색의 변경</h1>
<br>
※다음 버튼을 클릭하면 홈페이지의 배경색을 변경 할 수 있습니다.
<br><br>
<!-- 1번 -->
<!-- <input type="button" onclick="red()" value="빨강">
<input type="button" onclick="green()" value="녹색">
<input type="button" onclick="blue()" value="청색">
<input type="button" onclick="orange()" value="주황색">
<input type="button" onclick="black()" value="검정색">
<input type="button" onclick="white()" value="흰색">
<br><br><br><br><br><br><br><br>
</div>
<script type="text/javascript">
function red() {
document.bgColor = "red";
}
function green() {
document.bgColor = "green";
}
function blue() {
document.bgColor = "blue";
}
function orange() {
document.bgColor = "orange";
}
function black() {
document.bgColor = "black";
}
function white() {
document.bgColor = "white";
}
</script>
2. 2번 : 함수없이 한줄에 클릭을 document.bgColor을 호출하여 설정
<!-- 2번 -->
<button type="button" onclick="document.bgColor='red'">빨강</button>
<button type="button" onclick="document.bgColor='green'">녹색</button>
<button type="button" onclick="document.bgColor='blue'">청색</button>
3. 3번 : 매개변수가 있는 함수 1개로 입력값에따른 결과 도출
<!-- 3번 -->
<button type="button" onclick="colorSet(1)">파랑</button>
<button type="button" onclick="colorSet(2)">노랑</button>
<script type="text/javascript">
function colorSet(color) {
if (color == 1) {
document.bgColor = 'blue';
}else if (color ==2) {
document.bgColor = 'yellow';
}
}
'Java Script > work' 카테고리의 다른 글
| 미술관 링크로 이동하기 (0) | 2020.07.10 |
|---|---|
| 영어 속담으로 "1일 1개씩 먹으면 의사 필요없다"라고하는 과일은 무엇일까요? (0) | 2020.07.10 |
| 한라산 맞추기 (0) | 2020.07.09 |
| 변수의 연산 (0) | 2020.07.09 |
| 라면 타이머 (0) | 2020.07.09 |
