Cara menggunakan javascript menghitung luas segitiga

Contoh Javascript menghitung luas dan keliling segi empat berikut adalah untuk menunjukkan bagaimana menangkap input menggunakan tag HTML INPUT panjang dan lebar, kemudian memproses perhitungan luas dan keliling menggunakan Javascript.

Table of Contents Show

a. HTML form input
b. JAVASCRIPT menghitung Luas dan Keliling
c. Kode selengkapnya
d. Tampilan saat dijalankan

Contents

Javascript menghitung luas dan keliling segi empat
- a. HTML form input
- b. JAVASCRIPT menghitung Luas dan Keliling
- c. Kode selengkapnya
- d. Tampilan saat dijalankan

a. HTML form input

Pertama kita menggunakan tag <form> untuk mengelompokkan input yang akan kita terima dari user dan menyiapkan tempat untuk menampilkan hasil perhitungannya (output).

Terdapat sebuah pemanggilan kesebuah fungsi ketika tombol hitung ditekan.

onclick = “hitungLuasKeliling();”

b. JAVASCRIPT menghitung Luas dan Keliling

Fungsi hitungLuasKeliling() merupakan fungsi dengan Javascript.

Kita menggunakan document.getElementById untuk mengidentifikasi input dan output.

c. Kode selengkapnya

Berikut kode selengkapnya dari halaman untuk menghitung luas dan keliling. Halaman ini bisa disimpan dengan nama apapun dan diberi ekstensi .html. Selanjutnya halaman tinggal dijalankan dengan browser. Pada contoh ini, halaman akan disimpan dengan nama segiempat.html.

<!-- segiempat.html -->
<!DOCTYPE html">
<html>
     <head>
          <title>Menghitung luas dan keliling segiempat</title>
          <script type="text/javascript">
               function hitungLuasKeliling()
               {
                    var Panjang, Lebar, Keliling, Luas;

                    Panjang = parseInt(document.getElementById("panjang").value);
                    Lebar = parseInt(document.getElementById("lebar").value);
                    Keliling = 2 * (Panjang + Lebar);
                    Luas = Panjang * Lebar;
                    document.getElementById("keliling").value = Keliling;
                    document.getElementById("luas").value = Luas;
               }
          </script>
     </head>
     <body>
          <h2>Menghitung luas dan keliling segiempat</h2>
          <form>
               <p>Panjang: <input type="text" id="panjang"></p>
               <p>Lebar: <input type="text" id="lebar"></p>
               <p><input type="button" value="Hitung" onclick="hitungLuasKeliling();"> </p>
               <p>Luas: <input type="text" id="luas"></p>
               <p>Keliling: <input type="text" id="keliling"></p>
          </form>
     </body>
</html>