자바 스크립트 기초 문제/풀이

728x90

1.

문제 풀이 ->

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>

</head>
<body>

<img alt="내 메시지 입니다" id="img" src="tahiti01.jpg" onclick="alert('타히티 사진입니다')">
<br>
<img alt="" src="tahiti01.jpg" onclick="func()"> 

</body>

<script type="text/javascript">

function func() {
	alert('타히티 사진입니다');
}
/*
let msg = document.getElementById("img").alt;
alert(msg);*/

</script>


</html>

2.

문제 풀이 ->

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>


<h1>문제</h1>
<h3>한국에서 제일 높은 산은?</h3>
답:<input type="text" id="answer">

<input type="button" onclick="func()" value="답">


<script type="text/javascript">

function func(){
	let answer = document.getElementById('answer').value;
	if(answer == ""){
		alert('정답을 기입해주십시오');
	}
	else if(answer == "한라산"){
		alert('정답입니다.')
	}
	else {
		document.getElementById('answer').value="";
		alert('정답이 아닙니다.')
	}
}

</script>

</body>
</html>

3.

문제 풀이 ->

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

 <h3>변수의 연산</h3>
 a, b에 대해서 변수 a와 b의 계산 결과를 표시합니다.
 <br><br>
  <button type="button" onclick="plus()">덧셈</button>
<button type="button" onclick="minus()">뺄셈</button>
<button type="button" onclick="multi()">곱셈</button>
<button type="button" onclick="div()">나눗셈</button>
<button type="button" onclick="left()">나머지</button>
<br><br>  
<input type="text" id="a" size="10"/>
<input type="text" id="oper" size="5"/>
<input type="text" id="b" size="10"/>
=
<input type="text" id="result" size="10"/>

  <script type="text/javascript">

  let a, b;
   
    function getValue() {
    a = parseInt(document.getElementById("a").value);
    b = parseInt(document.getElementById("b").value);
    }
    
    function plus() {
      getValue();
      document.getElementById('oper').value='+';
      document.getElementById('result').value=a+b;
    }
    
    function minus() {
        getValue();
        document.getElementById('oper').value='-';
        document.getElementById('result').value=a-b;
      }
    
    function multi() {
        getValue();
        document.getElementById('oper').value='*';
        document.getElementById('result').value=a*b;
      }

    function div() {
      getValue();
      
      if(b==0) {
        alert('계산할 수 없습니다');
        return;
      }
      
      document.getElementById('oper').value='/';
      document.getElementById('result').value=a/b;
    }
    
    function left() {
        getValue();
        document.getElementById('oper').value='%';
        document.getElementById('result').value=a%b;
      }

    
    
  </script>
  
</body>
</html>

4.

문제 풀이 ->

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>

<h1>체육관 이용 요금</h1>
기본 사용료(2면, 4시간)40,800원
<br>
<input type="checkbox" name="gym" value=20000 onclick="cal()">야간조명(20,000원)
<br>
<input type="checkbox" name="gym" value=4000 onclick="cal()">배구네트x2면(4,000원)
<br>
<input type="checkbox" name="gym" value=5000 onclick="cal()">배구x10개 (5,000원)
<br>

합계금액 <input type="text" id="value" value="40800">원형


<script type="text/javascript">

function cal(){
	let value = document.getElementsByName("gym");  // 0, 1, 2
	let sum = 40800;
	let a = 0;
	let b = 0;
	let c = 0;
	
	if(value[0].checked)
	a=value[0].value*1;
	if(value[1].checked)
	b=value[1].value*1;
	if(value[2].checked)
	c=value[2].value*1;
	
	sum+=a+b+c;
	document.getElementById("value").value=sum;
	
}


</script>

</body>
</html>

저작자표시

'🚀 자바 스크립트 JavaScript' 카테고리의 다른 글

7️⃣ 자바 스크립트 - > 10진수를 2진수 8진수 16진수로 변환 (0)	2021.03.03
6️⃣ 자바 스크립트 - 문자/문자열 찾기, 갖고오기 (indexOf, slice 등) (0)	2021.03.03
5️⃣ 자바 스크립트 Date (0)	2021.03.02
4️⃣ 자바 스크립트 일반태그, 폼(from)태그 Getter와 Setter + 메소드 (0)	2021.03.02
3️⃣ 자바스크립트의 변수 var , let , const + ( foreach와 생성자 사용법 ) (0)	2021.03.02

👨‍💻 코딩 도서관

자바 스크립트 기초 문제/풀이 - 1️⃣ 📝

1.

2.

3.

4.

'🚀 자바 스크립트 JavaScript' 카테고리의 다른 글

댓글

티스토리툴바

자바 스크립트 기초 문제/풀이 - 1️⃣ 📝

1.

2.

3.

4.

'🚀 자바 스크립트 JavaScript' 카테고리의 다른 글

관련글

댓글

티스토리툴바