[HTML] 제어문- 반복문 while, 조건 판단문 if,

비타민규·2023년 8월 4일

[HTML]

목록 보기
9/25
<style type="text/css">
	.my{background-color: yellow;}
</style>"

<h2>제어문</h2>

<script>
	document.write('조건 판단문 if -------<br>')
	const irum='한국인';
	if(irum==='홍길동'){
		document.write('참');
		document.write('맞아요');
	}else{
		document.write('거짓');
	}
	
	document.write('<br>');
	let su = 9;
	if(su % 2 === 0)    // 수행할 문서가 2개 이상일 때만 {}블록으로 닫아줌
		document.write('<h1>짝수<h1>');
	else
		document.write('<span style="color:red;">홀수</span>');
</script>
<br>휴~ 숨 한번 쉬고<br>


<script>
	document.write('조건판단문 switch -------<br>');
	// let jumsu = prompt('학점 입력', 'A'); 
    // 기본값 A를 주는 명령프롬프트? 를 만들어냄
    
	let jumsu ='A';
	switch(jumsu.toLowerCase()){ // 점수값을 소문자화 하여 switch문 실행
		case 'a':
		case 'b':
		case 'c': document.write('good'); break;
		case 'd': document.write('normal'); break;
		default:document.write('etc');		
	}
</script>
<br>숨 한번 쉬고<br>

=> good출력됨


<script>
	document.write('반복문 for --------<br>');
	let a;
	for(a=1; a<= 5; a++){ 
    // 여기서 let a=1이라고 주면 블럭 내에서만 유효한 지역변수가 된다
		document.write(`a값은 ${a}<br>`);
	}
	document.write('반복문 수행 후 a값은 ${a}<br>');
	
	// 다중 for도 가능 : 생략
	document.write('<br>');
	for(let k=1; k<= 10; k+=1){
		if( k ===3)continue;
		document.write(`k값은 ${k}<br>`);
		if( k === 5)break;
	}
</script>


<script>
// 문제 2~9단까지 구구단 출력(table tag사용)
// 2*1=2 ... 2*9=18 ... 9*9=81
// 짝수 단의 배경색은 노랑 -css 적용 internal방식
	document.write('<br>');
	document.write('<br>구구단<br>');
	document.write('<table border="1">');
	for(let aa=2;aa<10;aa++){
		if(aa % 2 === 0)
			document.write('<tr class="my">');
		else
			document.write('<tr>');
		for(let b=1;b<10;b++){
			document.write('<td>');
			document.write(`${aa}*${b}=${aa*b}`);
			document.write('</td>');
		}
		document.write('</tr>');
	}
	document.write('</table>');


<script>
	document.write('<br>');
<!-- 내가 혼자 풀음( 테이블 태그를 쓰지 못함)
	let aa,bb;
	for(aa=2; aa<=9; aa++){
		for(bb=1; bb<=9; bb++){
	
			if(aa % 2 === 0) {
				document.write('<span style="background-color:yellow">',
                `${aa}*${bb}=${aa*bb}&nbsp;`,'</span>');
				}
			else{
				document.write(`${aa}*${bb}=${aa*bb} `);}
				
			}	document.write('<br>');
	}
-->
</script>

<script>
	<br> 숨 한 번 쉬고<br>
		document.write('반복문 while ----------<br>');
		let i=1;
		while(i <= 5){
				document.write(i);
				i++;
		}
		document.write('<br>');
		i=0;
		while(1){ // js에서 1은 true값을 의미
			i++;
			if(i ==3) continue; // i가 3일땐 출력하지 않고 다시 위로 올라감
			document.write(i);
			if(i == 5) break;
		}
</script>
<br>별도 작성된 js 호출<br>
<script type="text/javascript" src="js/js3_ex.js">
	// type은 생략가능
</script>

별도 작성된 js파일은 아래와 같다.

1, 3, 5가 출력된다.

profile
같이 일하고 싶은 개발자가 되어야지

0개의 댓글