>웹 프론트엔드 >JS 튜토리얼 >JavaScript는 간단한 계산기를 구현합니다.

JavaScript는 간단한 계산기를 구현합니다.

高洛峰
高洛峰원래의
2017-02-04 13:53:501182검색

머리말

안녕하세요 여러분, 저는 프론트엔드 js와 jq가 능숙하지 않아 많은 알고리즘과 잊어버리는 일이 없도록 한동안 공부하면서 프레임워크와 배경 내용에 대해 배웠습니다. 기본적인 사용법은 계속해서 기록과 축적을 위한 몇 가지 작은 기능적 효과 코드를 업데이트하도록 하겠습니다. 부족한 점이 많습니다. 당분간은 캡슐화와 코드 중복이 꼭 필요한 것은 아닙니다. 최선을 다해 개선하고 계속 업데이트해 보세요..

간단한 덧셈, 뺄셈, 곱셈, 나눗셈 계산기, 양식의 값을 사용하여 네이티브 js로 구현하고, 편집기에 직접 복사하여 열고 실행할 수 있습니다.

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>加减乘除计算器</title> 
 <script type="text/javascript">
  function count(){  
  var a = parseInt(document.getElementById("txt1").value);
  var b = parseInt(document.getElementById("txt2").value) ;
  var sign = document.getElementById("select").value;
  var result = 0;
    switch(sign){
      case "+": result = a+b;
      break;
      case "-": result = a-b;
      break;
      case "*": result = a*b;
      break;
      case "/": result = a/b;
      break;
      case "%": result = a%b;
      break;
     }
  document.getElementById("answer").value = result;
  }
 </script> 
 </head> 
 <body>
  <input type=&#39;text&#39; id=&#39;txt1&#39; /> 
  <select id=&#39;select&#39;>
    <option value=&#39;+&#39;>+</option>
    <option value="-">-</option>
    <option value="*">*</option>
    <option value="/">/</option>
    <option value="%">%</option>
  </select>
  <input type=&#39;text&#39; id=&#39;txt2&#39; /> 
    <input type=&#39;button&#39; value=&#39; = &#39; onclick="count()"/> 
    <!--通过 = 按钮来调用创建的函数,得到结果-->
  <input type=&#39;text&#39; id=&#39;answer&#39; />  
 </body>
</html>

이 기사의 전체 내용이 모든 사람의 학습에 도움이 되기를 바랍니다. 모든 사람이 PHP 중국어 웹사이트를 지원하기를 바랍니다.

간단계산기의 JavaScript 구현과 관련된 더 많은 글은 PHP 중국어 홈페이지를 주목해주세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.