Berikut adalah contoh program Javascript kalkulator sederhana:
<!DOCTYPE html>
<html>
<head>
<title>Kalkulator Sederhana</title>
<script>
function hitung() {
var angka1 = parseFloat(document.getElementById("angka1").value);
var angka2 = parseFloat(document.getElementById("angka2").value);
var operator = document.getElementById("operator").value;
var hasil;
if (operator == "tambah") {
hasil = angka1 + angka2;
} else if (operator == "kurang") {
hasil = angka1 - angka2;
} else if (operator == "kali") {
hasil = angka1 * angka2;
} else if (operator == "bagi") {
hasil = angka1 / angka2;
}
document.getElementById("hasil").value = hasil;
}
</script>
</head>
<body>
<h1>Kalkulator Sederhana</h1>
<form>
<label for="angka1">Angka 1:</label>
<input type="number" id="angka1"><br>
<label for="operator">Operator:</label>
<select id="operator">
<option value="tambah">+</option>
<option value="kurang">-</option>
<option value="kali">*</option>
<option value="bagi">/</option>
</select><br>
<label for="angka2">Angka 2:</label>
<input type="number" id="angka2"><br>
<button type="button" onclick="hitung()">Hitung</button><br>
<label for="hasil">Hasil:</label>
<input type="text" id="hasil" readonly>
</form>
</body>
</html>
Penjelasan:
- Pada baris ke-5 hingga 18, kita mendefinisikan fungsi
hitung(). Fungsi ini akan dijalankan ketika tombol “Hitung” ditekan. Pada fungsihitung(), kita mengambil nilai input angka 1, angka 2, dan operator yang dipilih dari elemen HTML menggunakandocument.getElementById(). Kita juga menghitung hasil operasi sesuai operator yang dipilih denganif-elsestatement. Terakhir, kita menampilkan hasil pada elemen HTML menggunakandocument.getElementById(). - Pada baris ke-21 hingga 33, kita mendefinisikan elemen HTML yang akan digunakan pada kalkulator sederhana. Kita menggunakan
inputuntuk input angka 1, input angka 2, dan output hasil, dan menggunakanselectuntuk memilih operator. - Pada baris ke-30, kita menambahkan event listener
onclickpada tombol “Hitung” untuk menjalankan fungsihitung()ketika tombol tersebut ditekan.
Contoh program di atas hanya menggunakan operasi matematika dasar seperti penjumlahan, pengurangan, perkalian, dan pembagian. Anda dapat mengembangkan program ini dengan menambahkan operasi lain seperti pangkat, akar, atau trigonometri, atau juga dengan mengubah tampilan kalkulator sederhana ini agar lebih menarik dan user-friendly.
Tolong Bagikan:
