무룩 공부방

[HTML] EX9) 버튼 함수 제작 (Notepad++/Java Script) 본문

IT/HTML

[HTML] EX9) 버튼 함수 제작 (Notepad++/Java Script)

moo_look 2023. 8. 25. 13:26

다음 조건을 만족하는 함수와 버튼을 만들어보았습니다.

 

*조건

메세지 창으로 숫자 5를 입력받아 변수 count에 저장하시오.
count 변수에 저장된 만큼 반복실행 하는 문장을 만드시오.(for)
1부터 count 숫자 까지 합계(sum)와 평균(avg)을 구하시오.
평균이 3점이상 이면 합격을 출력하시오.
합계구하기 버튼을 클릭했을 때 함수 sumFunc() 이름으로 위 조건들을 처리하시오.

 

<Source code>

<!doctype html>
<html>
	<head>
		<title>과제</title>
		<meta charset="utf-8">
		<script>
			function sumFunc(){	
				let count = prompt("숫자 5를 입력");
				let sum=0;
				let avg=0;
			
				for(i=1; i<=count; i++){
					sum+=i;
				}
				avg = sum/count;
			
				if(avg >= 3){
					alert("합계 = "+sum+"\n평균 = "+avg+"\n합격입니다")
				}else{
					alert("합계 = "+sum+"\n평균 = "+avg+"\n불합격입니다")
				}
			}
		</script>
	</head>
	<body>
		<input type="button" value="합계구하기" onclick="sumFunc();">
	</body>
</html>

<body>

합계구하기 버튼을 만들고 이 버튼을 누르면 sumFunc() 함수를 호출합니다.

 

<head>

count변수에 prompt로 입력받은 값을 저장합니다.

이후에 반복문을 count 입력한 값만큼 반복합니다.

합계 sum에 누적공식을 활용하여 1부터 반복한횟수인 count변수값까지 더한값을 저장하고 평균 avg를 구합니다.

이후 if문의 조건식을 활용하여 조건에 맞는 문장을 출력합니다.

 

 

<출력>

<5를 입력했을때 출력창>
<4를 입력했을때 출력창>

 

 

'IT > HTML' 카테고리의 다른 글

[HTML] EX11) 업다운 게임 만들기 (Notepad++/Java Script)  (0) 2023.08.26
[HTML] EX10) 함수와 매개변수(Notepad++/Java Script)  (0) 2023.08.26
[HTML] EX8) 증감연산자 (Notepad++/Java Script)  (0) 2023.08.24
[HTML] EX7) 반복문과 조건문을 활용한 홀수 짝수 판별 (Notepad++/Java Script)  (0) 2023.08.23
[HTML] EX6) 반복문을 통한 count program (Notepad++/Java Script)  (0) 2023.08.22
'IT/HTML' Related Articles more