Javascript

(자바스크립트) 계산기 만들기

고니자니 2023. 7. 15. 12:17
반응형

다음 코드는 자바스크립트를 이용한 계산기 프로그램입니다.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>자바스크립트 계산기</title>
<script>
function add() {
    var n1 = parseInt(document.getElementById("n1").value);
    var n2 = parseInt(document.getElementById("n2").value);
    var sum = n1+n2;
    document.getElementById("result").value = sum;
}
function sub() {
    var n1 = parseInt(document.getElementById("n1").value);
    var n2 = parseInt(document.getElementById("n2").value);
    var sub = n1-n2;
    document.getElementById("result").value = sub;
}
function mul() {
    var n1 = parseInt(document.getElementById("n1").value);
    var n2 = parseInt(document.getElementById("n2").value);
    var mul = n1*n2;
    document.getElementById("result").value = mul;
}
function div() {
    var n1 = parseInt(document.getElementById("n1").value);
    var n2 = parseInt(document.getElementById("n2").value);
    var div = n1/n2;
    document.getElementById("result").value = div;
}
</script>
</head>

<body>
<h2>자바스크립트 계산기</h2>

<table>
<tr>
     <td>숫자 1</td>
     <td><input type="text" id = "n1" size="10"></td>
</tr>
      <td>숫자 2</td>
      <td><input type="text" id = "n2" size = "10"></td>
<tr>
      <td></td>
	  <td>
	  <input type="button" value=" + " onclick="add()">
      <input type="button" value=" - " onclick="sub()">
      <input type="button" value=" * " onclick="mul()">
      <input type="button" value=" / " onclick="div()">
      </td>
</tr>
<tr>
      <td>결과</td>
      <td><input type="text" id = "result" size= "10"></td>
</tr>
</table>
</body>
</html>

 

자바스크립트 계산기

 

 

728x90
반응형