Link
09-25 13:23
«   2020/09   »
    1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30      
Archives
Today
939
Total
1,023,685
관리 메뉴

꿈 많은 사람의 이야기

자바스크립트 구구단 출력해보기 본문

javascript

자바스크립트 구구단 출력해보기

이수진의 블로그 이수진의 블로그 2017. 8. 22. 08:53
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        div#area{
            font-size: 30px;
        }
    </style>
</head>
<body>
   시작단: <input type="text" id="start"> <br>
   종료단: <input type="text" id="end"><br>
   <input type="button" id="sBtn" value="실행">
   <hr>
   <div id="area">구구단 출력
       
   </div>
 
</body>
</html>
 
 
<script>
    var area = document.getElementById("area");
    //아이디가 area인 DOM(document object model, 문서 객체 모델) 생성(참조)
    var gugudan = "";
 
    var btn = document.getElementById("sBtn");
    btn.onclick = function(){
            
        var start = Number(document.getElementById("start").value);
        var end = Number(document.getElementById("end").value);
        if(start > end){   //시작값이 끝 값보다 크면 값을 바꿔줌
            var tmp = start;
            start = end;
            end = tmp;
        }
        for(var i = start ; i <= end ; i++){
            for(var j = 1 ; j <= 9 ; j++){
                gugudan += i+"*"+j+"= "+(i*j)+"<br>";
            }
 
        }
        area.innerHTML = gugudan;
    }
    
</script>
Colored by Color Scripter


0 Comments
댓글쓰기 폼