과제
2022.08.11/ Hw1
구구단(2~9단)을 열방향(세로방향)으로 출력하는 프로그램을 작성하세요 (테이블 태그를 사용해서 처리)
참고사진
의도
Javascript 제어문 사용
Javascript 내에서 HTML 태그 사용
깃허브
https://github.com/kindacool/Hw/blob/main/HW20220811/20220811_hw1.html
GitHub - kindacool/Hw
Contribute to kindacool/Hw development by creating an account on GitHub.
github.com
코드
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
caption {
font-size : 30px;
font-weight: bold;
}
</style>
</head>
<body>
<script>
// 구구단(2~9단)을 열방향(세로방향)으로 출력하는 프로그램을 작성하세요? (테이블 태그를 사용해서 처리)
//테이블시작
document.write("<table border=1 align=center cellpadding = 15>");
document.write("<caption>구구단</caption>");
//헤드(1행)
document.write("<tr>");
for(var dan = 2; dan <= 9; dan++) {
document.write("<th>" + dan + "단</th>");
}
document.write("</tr>") ;
//바디(2행)
document.write("<tr>");
for(var dan = 2; dan <= 9; dan++) {
document.write("<td>")
for(var i = 1; i <= 9; i ++) {
document.write(dan + " * " + i + " = " + dan*i + "<br>");
}
document.write("</td>")
}
document.write("</tr>") ;
//테이블끝
document.write("</table>");
</script>
</body>
</html>
출력
강사님 코드
<!DOCTYPE html>
<html>
<head><title>구구단</title>
<meta charset="UTF-8">
<style>
td{text-align:center}
caption{font-size:30px}
</style>
</head>
<body>
<table border=1 align=center width=800 height=280>
<caption>구구단</caption>
<tr>
<script>
for(var dan=2; dan<=9; dan++)
document.write("<th>[ "+dan+" 단 ]</th>");
document.write("</tr><tr>");
for(var dan=2;dan<=9;dan++) { // 단
// document.write("<td>"+dan+"단<br>");
document.write("<td>");
for(var i=1;i<=9;i++) {
document.write(dan+"*"+i+"="+dan*i+"<br>");
}
document.write("</td>");
}
</script>
</tr>
</table>
</body>
</html>