latest Post

Penggunaan Variabel


Penggunaan Variabel

Hai, diawal kita ketik atau tulis script dibawah ini pada text editor :

 <html>
   <head>
     <title>Variabel</title>
     <script type="text/javascript">
       var a, b, c;
       a = "Data variabel a";
       b = 7;
       c = "Ini adalah variabel";
       document.write(a + "<br>");
       document.write(b + "<br>");
       document.write(c + "<br>");
     </script>
   </head>
   <body>
   </body>
 </html>
Simpan file tersebut dengan nama variabel.html

Pada contoh diatas baris pertama adalah data yang disimpan pada variabel a, baris kedua adalah data yang disimpan pada variabel b dan baris ketiga adalah data yang ada pada variabel c.

Contoh :

 <html>
   <head>
     <title>Variabel</title>
     <script type="text/javascript">
         var a;
         var b = 7;
         a = 2 * b;
document.write("nilai a adalah : " + a);
     </script>
   </head>
   <body>
   </body>
 </html>

Hasilnya :
Contoh :

 <html>
   <head>
     <title>Variabel</title>
       <script type="text/javascript">
          var a = "123";
  var b = "456";
  var c = "hallo";
  var d = "22hay";
  var e = "123,45";
  var f = "123.45";

  document.write(a+b + "<br>");
  document.write(parseInt(a) + parseInt(b) + "<br>");
  document.write(parseInt(c) + "<br>");
  document.write(parseInt(d) + "<br>");
  document.write(parseFloat(e) + "<br>");
  document.write(parseFloat(f) + "<br>");
  document.write(parseFloat(b) / parseFloat(a));
       </script>
     </head>
   <body>
   </body>
 </html>

Hasilnya:

Contoh memproses hasil form dengan javascript :


 <html>
  <head>
   <title>Penjumlahan</title>
     <script type="text/javascript">
       function hitung() {
         var a = parseInt(document.getElementById('a').value);
 var b = parseInt(document.getElementById('b').value);
 var hasil = a + b;
 document.getElementById("hasil").value = hasil;
       }
   </script>
  </head>
  <body>
   <form>
     <input type="text" id="a" placeholder="Angka Pertama"><br>
     <input type="text" id="b" placeholder="Angka Kedua"><br>
     <input type="text" id="hasil" placeholder="Hasil" disabled><br>
     <input type="button" id="button" value="Hitung" onclick="hitung()">
   </form>
  </body>
 </html>

Hasilnya :

Contoh menghitung luas dan keliling lingkaran dengan JavaScript :


 <html>
  <head>
   <title>Lingkaran</title>
    <script type="text/javascript" language="javascript">
     function hitung() {
      //hitung keliling
      var d = parseInt(document.getElementById('d').value);
      var keliling = 3.14 *d;
      document.getElementById("keliling").value=keliling;

      //hitung luas
      var r = d / 2;
      var luas = 3.14 *r *r;
      document.getElementById("luas").value=luas;
     }
   </script>
  </head>
  <body>
   <form>
    <table>
     <tr>
      <td>Diameter</td>
      <td>:</td>
      <td><input type="text" id="d" placeholder="Diameter"></td>
     </tr>
     <tr>
       <td>Luas</td>
       <td>:</td>
       <td><input type="text" id="luas" placeholder="Luas" disabled></td>
     </tr>
     <tr>
       <td>Keliling</td>
       <td>:</td>
       <td><input type="text" id="keliling" placeholder="Keliling" disabled></td>
     </tr>
     <tr>
      <td><input type="button" id="button" value="hitung" onclick="hitung()"></td>
     </tr>
    </table>
   </form>
  </body>
 </html>
Hasil :

Perhitungan :

Contoh menghitung luas permukaan, volume dan selimut tabung dengan JavaScript :

 <html>
  <head>
   <title>Lingkaran</title>
    <script type="text/javascript" language="javascript">
    function hitung() {
    //hitung luas permukaan
     var r = parseInt(document.getElementById('r').value);
     var t = parseInt(document.getElementById('t').value);
     var luaspermukaan = 2 * 3.14 * r * ( r + t );//Luas permukaan: 2 π r (r+t)
     document.getElementById("luaspermukaan").value=luaspermukaan;
   
     //hitung selimut
     var selimut = 2 * 3.14 * r * t;//Luas selimut: 2 π r t
     document.getElementById("selimut").value=selimut;
   
     //hitung volume
     var volume = 3.14 * r * r * t;//Volume : π r2 t
     document.getElementById("volume").value=volume;
     }
    </script>
   </head>
   <body>
    <form>
     <table border="0px">
      <tr>
       <td>Jari-Jari</td>
       <td>:</td>
       <td><input type="text" id="r" placeholder="Jari-Jari"></td>
      </tr>
      <tr>
       <td>Tinggi</td>
       <td>:</td>
       <td><input type="text" id="t" placeholder="Tinggi"></td>
      </tr>
      <tr>
       <td>Luas Permukaan</td>
       <td>:</td>
       <td><input type="text" id="luaspermukaan" placeholder="Luas Permukaan" disabled></td>
      </tr>
      <tr>
       <td>Volume</td>
       <td>:</td>
       <td><input type="text" id="volume" placeholder="Volume" disabled></td>
      </tr>
      <tr>
       <td>Selimut</td>
       <td>:</td>
       <td><input type="text" id="selimut" placeholder="Selimut" disabled></td>
      </tr>
      <tr>
       <td><input type="button" id="button" value="Hitung" onclick="hitung()"></td>
      </tr>
     </table>
    </form>
   </body>
 </html>
Hasil :
Perhitungan :

Contoh menjumlah dan rata-ratakan 10 bilangan dengan JavaScript :

 <html>
  <head>
   <title>Jumlah Rata-Rata</title>
   <script type="text/javascript" language="javascript">
   function hitung () {
    var a = parseInt(document.getElementById('a').value);
    var b = parseInt(document.getElementById('b').value);
    var c = parseInt(document.getElementById('c').value);
    var d = parseInt(document.getElementById('d').value);
    var e = parseInt(document.getElementById('e').value);
    var f = parseInt(document.getElementById('f').value);
    var g = parseInt(document.getElementById('g').value);
    var h = parseInt(document.getElementById('h').value);
    var i = parseInt(document.getElementById('i').value);
    var j = parseInt(document.getElementById('j').value);
    var jumlah = a + b + c + d + e + f + g + h + i + j;
    var hasil = ( a + b + c + d + e + f + g + h + i + j) / 10;
    document.getElementById("jumlah").value=jumlah;
    document.getElementById("hasil").value=hasil;
    }
    </script>
   </head>
   <body>
    <form>
     <table>
      <tr>
       <td>Angka pertama</td>
       <td>:</td>
       <td><input type="text" id="a" placeholder="Angka pertama"></td>
      </tr>
      <tr>
       <td>Angka kedua</td>
       <td>:</td>
       <td><input type="text" id="b" placeholder="Angka kedua"></td>
      </tr>
      <tr>
       <td>Angka ketiga</td>
       <td>:</td>
       <td><input type="text" id="c" placeholder="Angka ketiga"></td>
      </tr>
      <tr>
       <td>Angka keempat</td>
       <td>:</td>
       <td><input type="text" id="d" placeholder="Angka keempat"></td>
      </tr>
      <tr>
       <td>Angka keenam</td>
       <td>:</td>
       <td><input type="text" id="e" placeholder="Angka kelima"></td>
      </tr>
      <tr>
      <td>Angka ketujuh</td>
      <td>:</td>
      <td><input type="text" id="f" placeholder="Angka keenam"></td>
      </tr>
      <tr>
       <td>Angka ketujuh</td>
       <td>:</td>
       <td><input type="text" id="g" placeholder="Angka ketujuh"></td>
       </tr>
       <tr>
        <td>Angka kedelapan</td>
        <td>:</td>
        <td><input type="text" id="h" placeholder="Angka kedelapan"></td>
       </tr>
       <tr>
        <td>Angka kesembilan</td>
        <td>:</td>
        <td><input type="text" id="i" placeholder="Angka kesembilan"></td>
       </tr>
       <tr>
        <td>Angka kesepuluh</td>
        <td>:</td>
        <td><input type="text" id="j" placeholder="Angka kesepuluh"></td>
       </tr>
       <tr>
        <td>Jumlah</td>
        <td>:</td>
        <td><input type="text" id="jumlah" placeholder="Jumlah" disabled></td>
       </tr>
       <tr>
        <td>Rata - Rata</td>
        <td>:</td>
        <td><input type="text" id="hasil" placeholder="Rata - Rata" disabled></td>
       </tr>
       <tr>
        <td><input type="button" id="button" value="Hitung" onclick="hitung()"></td>
       </tr>
      </table>
     </form>
    </body>
   </html>
Hasil :
Penjumlahan :

Sekian yang dapat saya share di post kali ini terima kasih.

About Unknown

Unknown
Recommended Posts × +

0 komentar:

Posting Komentar