Rumah > hujung hadapan web > Soal Jawab bahagian hadapan > JavaScript melaksanakan empat operasi aritmetik mudah

JavaScript melaksanakan empat operasi aritmetik mudah

WBOY
Lepaskan: 2023-05-18 10:14:07
asal
1603 orang telah melayarinya

Javascript ialah bahasa pengaturcaraan yang digunakan secara meluas dalam pembangunan bahagian hadapan, juga dikenali sebagai bahasa skrip. Ia boleh melaksanakan banyak fungsi, termasuk empat operasi aritmetik mudah. Artikel ini akan memperkenalkan cara menggunakan javascript untuk melaksanakan empat operasi aritmetik mudah.

  1. Input nombor

Untuk melakukan empat operasi aritmetik, anda perlu memasukkan nombor terlebih dahulu. Anda boleh menggunakan teg input dalam HTML untuk memasukkan nombor. Contohnya:

<input type="number" id="num1" placeholder="请输入第一个数字">
<input type="number" id="num2" placeholder="请输入第二个数字">
Salin selepas log masuk

Ini akan membolehkan anda memasukkan dua nombor pada halaman.

  1. Pemilihan pengendali operasi

Empat operasi aritmetik termasuk penambahan, penolakan, pendaraban dan pembahagian Kotak pilihan perlu disediakan pada halaman untuk dipilih oleh pengguna. Operator yang anda mahu lakukan. Ini boleh dicapai menggunakan teg pilih dalam HTML.

<select id="operator">
  <option value="+">加</option>
  <option value="-">减</option>
  <option value="*">乘</option>
  <option value="/">除</option>
</select>
Salin selepas log masuk

Ini membolehkan anda memilih salah satu daripada empat pengendali pada halaman.

  1. Pelaksanaan operasi

Dalam JavaScript, anda boleh menggunakan fungsi asas matematik untuk melaksanakan empat operasi aritmetik. Penambahan menggunakan operator +, penolakan menggunakan operator -, pendaraban menggunakan operator *, dan pembahagian menggunakan operator /. Oleh itu, kod boleh ditulis seperti berikut:

function calculate() {
  var num1 = document.getElementById('num1').value;
  var num2 = document.getElementById('num2').value;
  var operator = document.getElementById('operator').value;
  var result;

  switch (operator) {
    case '+':
      result = parseFloat(num1) + parseFloat(num2);
      break;
    case '-':
      result = parseFloat(num1) - parseFloat(num2);
      break;
    case '*':
      result = parseFloat(num1) * parseFloat(num2);
      break;
    case '/':
      result = parseFloat(num1) / parseFloat(num2);
      break;
    default:
      result = '请选择操作符';
  }

  document.getElementById('result').value = result;
}
Salin selepas log masuk

Kod ini mula-mula mendapatkan nombor dan operator pada halaman, dan kemudian menggunakan pernyataan suis untuk melaksanakan operasi tertentu. Akhirnya keputusan dipaparkan pada halaman.

  1. Contoh kod lengkap
<!DOCTYPE html>
<html>

<head>
  <title>Javascript四则运算示例</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
</head>

<body>
  <h1>Javascript四则运算示例</h1>
  <p>输入两个数字,选择一个操作符,点击计算按钮进行运算</p>
  <input type="number" id="num1" placeholder="请输入第一个数字">
  <input type="number" id="num2" placeholder="请输入第二个数字">
  <select id="operator">
    <option value="+">加</option>
    <option value="-">减</option>
    <option value="*">乘</option>
    <option value="/">除</option>
  </select>
  <button onclick="calculate()">计算</button>
  <input type="text" id="result" readonly>

  <script>
    function calculate() {
      var num1 = document.getElementById('num1').value;
      var num2 = document.getElementById('num2').value;
      var operator = document.getElementById('operator').value;
      var result;

      switch (operator) {
        case '+':
          result = parseFloat(num1) + parseFloat(num2);
          break;
        case '-':
          result = parseFloat(num1) - parseFloat(num2);
          break;
        case '*':
          result = parseFloat(num1) * parseFloat(num2);
          break;
        case '/':
          result = parseFloat(num1) / parseFloat(num2);
          break;
        default:
          result = '请选择操作符';
      }

      document.getElementById('result').value = result;
    }
  </script>

</body>

</html>
Salin selepas log masuk
  1. Ringkasan

Melalui contoh kod di atas, kita dapat melihat bahawa javascript boleh menjadi sangat mudah Laksanakan empat operasi aritmetik mudah. Dalam pembangunan sebenar, kaedah pelaksanaan ini boleh digunakan pada halaman untuk memudahkan pengguna melakukan pengiraan yang mudah.

Atas ialah kandungan terperinci JavaScript melaksanakan empat operasi aritmetik mudah. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan