1번
<body>
<div style="border: 1px solid skyblue;">
<h1>2개의 주사위</h1>
<br>
버튼을 클릭하면 2개의 주사위가 랜덤됩니다.
<br><br>
<img alt="" src="./images/sai_1.gif" width="20" height="20" id="img1">
<img alt="" src="./images/sai_6.gif" width="20" height="20" id="img2">
<br><br>
<input type="button" value="주사위를 굴린다" id="ran" onclick="Random()">
<br><br><br><br><br><br>
</div>
<script type="text/javascript">
function Random() {
let arr = ["./images/sai_1.gif", "./images/sai_2.gif", "./images/sai_3.gif",
"./images/sai_4.gif", "./images/sai_5.gif", "./images/sai_6.gif"]
let i = Math.floor(Math.random()*6);
let j = Math.floor(Math.random()*6);
document.getElementById("img1").src = arr[i];
document.getElementById("img2").src = arr[j];
}
</script>
2번
<body>
<div style="border: 1px solid skyblue;">
<h1>2개의 주사위</h1>
<br>
버튼을 클릭하면 2개의 주사위가 랜덤됩니다.
<br><br>
<img alt="" src="./images/sai_1.gif" width="20" height="20" id="img1">
<img alt="" src="./images/sai_6.gif" width="20" height="20" id="img2">
<br><br>
<input type="button" value="주사위를 굴린다" id="ran" onclick="Random()">
<br><br><br><br><br><br>
</div>
<script type="text/javascript">
function Random() {
let r1 = Math.random()*6;
let r2 = Math.random()*6;
r1=Math.ceil(r1);
r2=Math.ceil(r2);
//2번
document.getElementById("img1").src = './images/sai_'+r1+'.gif';
document.getElementById("img2").src = './images/sai_'+r2+'.gif';
document.getElementById("img1").innerHTML = r1+r2;
}
</script>
</body>
3번
<body>
<div style="border: 1px solid skyblue;">
<h1>2개의 주사위</h1>
<br>
버튼을 클릭하면 2개의 주사위가 랜덤됩니다.
<br><br>
<img alt="" src="./images/sai_1.gif" width="20" height="20" id="img1">
<img alt="" src="./images/sai_6.gif" width="20" height="20" id="img2">
<br><br>
<input type="button" value="주사위를 굴린다" id="ran" onclick="Random()">
<br><br><br><br><br><br>
</div>
<script type="text/javascript">
function Random() {
let r1 = Math.random()*6;
let r2 = Math.random()*6;
r1=Math.ceil(r1);
r2=Math.ceil(r2);
//3번
document.images[0].src = './images/sai_'+r1+'.gif';
document.images[1].src = './images/sai_'+r2+'.gif';
document.getElementById("img1").innerHTML = r1+r2;
}
</script>
'Java Script > work' 카테고리의 다른 글
| 다음 생일까지 남은 일수 (0) | 2020.07.10 |
|---|---|
| 현재 시각은**입니다 (0) | 2020.07.10 |
| 미술관 링크로 이동하기 (0) | 2020.07.10 |
| 영어 속담으로 "1일 1개씩 먹으면 의사 필요없다"라고하는 과일은 무엇일까요? (0) | 2020.07.10 |
| 배경색의 변경 (0) | 2020.07.10 |
