728x90
반응형
◆ 자바스크립트
→ k가 변수인 for문 안에 i가 변수인 for문을 중첩함
→ 구구단은 2단부터 있으므로 k=2부터 시작함
// k : 몇 단인지
for(var k=2; k<10; k++){
document.write('<div>');
document.write('<h3>'+k+'단</h3>');
// i = 숫자x단
for(var i =1; i<10; i++){
document.write(i+ ' x ' + k + ' = ' + (i*k)+'<br>');
}
document.write('</div>');
}
◆ 전체
→ 원래는 html/css/js 파일을 다 따로 만들어야하나 간단한 문제이므로 그냥 한번에 함
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>for문을 사용한 구구단 만들기</title>
<style>
body{
display: flex;
position: relative;
justify-content: space-around;
flex-wrap: wrap;
}
div{
border: 1px solid black;
width: 100px;
height: 240px;
padding: 10px;
margin: 10px;
display: inline-block;
align-items: center;
text-align: center;
}
h3{
text-align: center;
margin: 0px 0px 10px 0px;
}
h2{
text-align: center;
width: 100%;
}
</style>
</head>
<body>
<h2>[구구단]</h2>
<script>
// k : 몇 단인지
for(var k=2; k<10; k++){
document.write('<div>');
document.write('<h3>'+k+'단</h3>');
// i = 숫자x단
for(var i =1; i<10; i++){
document.write(i+ ' x ' + k + ' = ' + (i*k)+'<br>');
}
document.write('</div>');
}
</script>
</body>
</html>
◆ 결과
728x90
반응형
'Coding With Jina > JavaScript' 카테고리의 다른 글
| [1분코딩] 자바스크립트 기초 - 객체 (0) | 2020.11.26 |
|---|---|
| [자바스크립트] while문을 이용한 팩토리얼 계산기 (0) | 2020.11.25 |
| [1분코딩] 자바스크립트 기초 - 변수 (0) | 2020.11.17 |
| [1분코딩] 자바스크립트 기초 - 함수와 return (0) | 2020.11.11 |
| [자바스크립트] 바닐라자바스크립트를 이용하여 시계 만들기 (1) | 2020.11.04 |