Selasa, 26 Februari 2019

TUGAS 3 JAVASCIRPT


  •  Menggunakan tag <SCRIPT>

 <HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<BODY>
<SCRIPT language="Javascript">
<!--
 alert("Hallo !");
// -->
</SCRIPT>
</BODY>
</HTML>

  • Properti


<HTML>
<HEAD>
<TITLE>Properti defaultStatus</TITLE>
</HEAD>
<BODY>
<H1>Tes defaultStatus</H1>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   window.defaultStatus = "Selamat belajar JavaScript“ ;
//-->
</SCRIPT>
</BODY>
</HTML>

  • Metode

<HTML>
<HEAD>
<TITLE>Skrip Javascript</TITLE>
</HEAD>
<BODY>
<SCRIPT language="Javascript">
<!--
                                                                                                                                                                              document.write(“Selamat Mencoba JavaScript <BR>”):
      document.write(“Semoga Sukses” !”);
// -->
</SCRIPT>
</BODY>
</HTML> 

  • Penanganan Kejadian (Event Handler)

<HTML>
<HEAD>
<TITLE>Kejadian</TITLE>
</HEAD>
<BODY>
<H1>Tes Kejadian</H1>
<P>Cobalah meletakkan penunjuk mouse ke link berikut
dan perhatikan isi baris status.
Kemudian pindahkan penunjuk mouse dari
link berikut dan perhatikan isi baris status
</P>
<A HREF = "www.fujitsu.com"
   onMouseOver = "window.status =
                  'Anda menyorot link, lho';
                  return true"
   onMouseOut  = "window.status = '';
                  return true">Fujitsu</A>
</BODY>
</HTML>

  • Pemasukan Data

<HTML>        
<HEAD>
<TITLE>Pemasukan Data</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var nama = prompt("Siapa nama Anda?");
   document.write("Hai, " + nama);
//-->
</SCRIPT>
</BODY>
</HTML>

  • jendela peringatan

<HTML>           
<HEAD>
<TITLE>Alert Box</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   window.alert("Ini merupakan pesan untuk Anda");
//-->
</SCRIPT>
</BODY>
</HTML>


  • . jendela konfirmasi

<HTML>
<HEAD>
<TITLE>Konfirmasi</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var jawaban = window.confirm(
                 "Anda ingin meneruskan?");
   document.write("Jawaban Anda: " + jawaban);
//-->
</SCRIPT>
</BODY>
</HTML>




  • Mendeklarasikan Variabel

<SCRIPT language="Javascript">
<!–
var VariabelKu;
var VariabelKu2 = 3;
VariabelKu = 2;
document.write(VariabelKu*VariabelKu2);
// -->
</SCRIPT> 


  • Konversi Tipe Data

<HTML>
<HEAD>
<TITLE>Konversi Bilangan</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var a = parseInt("27");
   document.write("1. " + a + "<BR>");
   a = parseInt("27.5");
   document.write("2. " + a + "<BR>");
   var a = parseInt("27A");
   document.write("3. " + a + "<BR>");
            a = parseInt("A27.5");
   document.write("4. " + a + "<BR>");
   var b = parseFloat("27");
   document.write("5. " + b + "<BR>");
            b = parseFloat("27.5");
   document.write("6. " + b + "<BR>");
   var b = parseFloat("27A");
   document.write("7. " + b + "<BR>");
           b = parseFloat("A27.5");
   document.write("8. " + b + "<BR>")
//-->
</SCRIPT>
</BODY>
</HTML>


  • Operator Matematika

<HTML>
<HEAD>
<TITLE>Operasi Matematika</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   document.write("20 + 3 = " + (20 + 3) );
   document.write("<BR>");
   document.write("20 + 3 = " + (20 - 3) );
   document.write("<BR>");
   document.write("20 * 3 = " + (20 * 3) );
   document.write("<BR>");
   document.write("20 / 3 = " + (20 / 3) );
   document.write("<BR>");
   document.write("20 % 3 = " + (20 % 3) );
   document.write("<BR>");
//-->
</SCRIPT>
</BODY>
</HTML>


  • Operator Pembanding dan Logika

<HTML>
<HEAD>
<TITLE>Operator ?</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var nilai = prompt("Nilai (0-100): ", 0);
   var hasil = (nilai >= 60) ? "Lulus" : "Tidak Lulus";
   document.write("Hasil: " + hasil);
//-->
</SCRIPT>
</BODY>
</HTML>




  • pernyataan if tanpa else

<HTML>
<HEAD>
<TITLE>Contoh if</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">

<!--
   var nilai = prompt("Nilai (0-100): ", 0);
   var hasil = "Tidak Lulus";
   if (nilai >= 60)
      hasil = "Lulus";
   document.write("Hasil: " + hasil);
//-->
</SCRIPT>
</BODY>
</HTML>


  • Pernyataan IF dengan ELSE

<HTML>
<HEAD>
<TITLE>Contoh if-else</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var nilai = prompt("Nilai (0-100): ", 0);
   var hasil = "";
   if (nilai >= 60)
      hasil = "Lulus";
   else
      hasil = "Tidak Lulus";
   document.write("Hasil: " + hasil);
//-->
</SCRIPT>
</BODY>
</HTML>



  • Pernyataan IF Bersarang

<HTML>
<HEAD>
<TITLE>Contoh if Berkalang</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var tanggal = new Date();
   var kode_hari = tanggal.getDay();
   var nama_hari = "";
   if (kode_hari == 0)
      nama_hari = "Minggu";
   else
      if (kode_hari == 1)
         nama_hari = "Senin";
      else
         if (kode_hari == 2)
            nama_hari = "Selasa";
         else
            if (kode_hari == 3)
               nama_hari = "Rabu";
            else
               if (kode_hari == 4)
                  nama_hari = "Kamis";
               else
                                 if (kode_hari == 5)
                     nama_hari = "Jumat";
                  else
                     nama_hari = "Sabtu";
   document.write("Hari ini hari " + nama_hari);
   document.write(", tanggal " + tanggal.getDate() +
                  "/" + (tanggal.getMonth() + 1) +
                  "/" + tanggal.getYear());
//-->
</SCRIPT>
</BODY>
</HTML>

  • Pernyataan Switch

<HTML>
<HEAD>
<TITLE>Contoh switch</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var tanggal = new Date();
   var kode_hari = tanggal.getDay();
   var nama_hari = "";
   switch(kode_hari) {
      case 0:
         nama_hari = "Minggu";
         break;
      case 1:
         nama_hari = "Senin";
         break;
      case 2:
         nama_hari = "Selasa";
         break;
      case 3:
         nama_hari = "Rabu";
         break;
      case 4:
         nama_hari = "Kamis";
         break;
     
     case 5:
         nama_hari = "Jumat";
         break;
      case 6:
         nama_hari = "Sabtu";
   }
   document.write("Hari ini hari " + nama_hari);
   document.write(", tanggal " + tanggal.getDate() +
                  "/" + (tanggal.getMonth() + 1) +
                  "/" + tanggal.getYear());
//-->
</SCRIPT>
</BODY>
</HTML>

  • Proses Berulang : Pernyataan While

<HTML>
<HEAD>
<TITLE>Contoh while</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var bilangan = 0;
   while (bilangan < 5) {
      document.write("JavaScript<BR>");
      bilangan++;
   }
//-->
</SCRIPT>
</BODY>
</HTML>


  • Pernyataan Do….While

<HTML>
<HEAD>
<TITLE>Contoh do while</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var bilangan = 1;
   do {
      document.write(bilangan + "<BR>");
      bilangan++;
   } while (bilangan < 6);
//-->
</SCRIPT>
</BODY>
</HTML>

  • Pernyataan For….

<HTML>
<HEAD>
<TITLE>Contoh for</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var bilangan = 0;
   for (bilangan = 1; bilangan <= 5; bilangan++)
      document.write(bilangan + "<BR>");
//-->
</SCRIPT>
</BODY>
</HTML>


  • Proses Pengulangan dalam Pengulangan

<HTML>
<HEAD>
<TITLE>Contoh for Berkalang</TITLE>
</HEAD>
<BODY>
<PRE>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   var baris, i = 0;
   var nilai_prompt = prompt("Tinggi: ", 5);
   var tinggi = parseInt(nilai_prompt);
   for (baris = 1; baris <= tinggi ; baris++) {
      // Buat sejumlah spasi
      for (i = 1; i <= tinggi - baris; i++) {
         document.write(" ");  // Karakter spasi
      }
       // Tampilkan *
      for (i = 1; i < 2 * baris; i++) {
         document.write("*");
      }
         // Pindah baris
      document.write("\n");
   }
//-->
</SCRIPT>
</PRE>
</BODY>
</HTML>




  • fungsi

HTML>
<HEAD>
<TITLE>Contoh Fungsi</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   function jumlah(x, y) {
      var hasil = x + y;
      return(hasil);
   }
   var z = jumlah(2, 3);
    document.write(z);
   document.write("<BR>");
   document.write(jumlah(4, 5));
//-->
</SCRIPT>
</BODY>
</HTML>


  • fungsi rekursif

<HTML>
<HEAD>
<TITLE>Variabel Lokal</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   function faktorial(n) {
      if (n == 0)
         return(1);
      else
         return( n * faktorial(n-1));
   }
   var z = 77;
   document.write("4! = " + faktorial(4));
//-->
</SCRIPT>
</BODY>
</HTML>

  • fungsi yang dibuat sendiri

<HTML>
<HEAD>
<TITLE>Validasi Masukan</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   function cekNama(form) {
      if (form.elements[0].value == "") {
         alert("Nama harus dimasukkan");
         form.nama.focus();
         form.nama.select();
         return(false);
      }
      alert("Terima kasih, " +
            form.elements[0].value);   
      return(true);
   }
//-->
</SCRIPT>
<FORM NAME = "formku">
<PRE>
Nama : <INPUT TYPE = "TEXT" NAME = "nama"><BR>
<INPUT TYPE = "BUTTON" VALUE = "Kirim"
       onClick = "cekNama(this.form)"><BR>
</PRE>
</FORM>
</BODY>
</HTML>


  • fungsi yang dibuat sendri 1

<HTML>
<HEAD>
<TITLE>Jam</TITLE>
</HEAD>
<BODY>
<FORM NAME = "formWaktu">
Waktu Sekarang :
<INPUT TYPE = "TEXT"
       NAME = "teksWaktu"
       VALUE = ""
       SIZE = "22">
</FORM>
<SCRIPT LANGUAGE = "JavaScript">
<!--
  
function aturWaktu() {
      var sekarang = new Date();
      var waktuSekarang = sekarang.toLocaleString();
         document.formWaktu.teksWaktu.value =
          waktuSekarang;
      setTimeout('aturWaktu()', 1000);     
      return(true);
   }
   // Menjalankan fungsi aturWaktu
   aturWaktu();
//-->
</SCRIPT>
</BODY>
</HTML>

  • . Objek Array

<HTML>
<HEAD>
<TITLE>Properti prototype</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   function tampilkanElemenArray() {
      for (var i = 0; i < this.length; i++) {
         document.write("[" + i + "] = " +
                        this[i] + "<BR>");
      }
   }  
   Array.prototype.cetak = tampilkanElemenArray;
   var musik = new Array("Jazz", "Rock",
                         "keroncong", "Dangdut");
   var tanaman = new Array("Aglaonema", "Begonia",
                           "Bromelia");
   document.write("Isi array musik: <BR>");
   musik.cetak();
   document.write("Isi array tanaman: <BR>");
   tanaman.cetak();
//-->
</SCRIPT>
</BODY>
</HTML>


  • objek radio

<HTML>
<HEAD>
<TITLE>Mengakses Objek radio</TITLE>
</HEAD>
<BODY>
Klik pada musik yang paling Anda sukai<BR>
<FORM NAME = "formTes"
      METHOD  = "GET">
<INPUT TYPE = "RADIO"
       NAME = "radioMusik"
       VALUE = "Jazz"
       onClick = "info()">Jazz<BR>
<INPUT TYPE = "RADIO"
       NAME = "radioMusik"
       VALUE = "Keroncong"
       onClick = "info()">Keroncong<BR>
<INPUT TYPE = "RADIO"
       NAME = "radioMusik"
       VALUE = "Dangdut"
       onClick = "info()">Dangdut<BR>
<INPUT TYPE = "RADIO"
       NAME = "radioMusik"
       VALUE = "Lainnya"
       onClick = "info()">Lainnya<BR>
<HR>
Info:
<INPUT TYPE = "TEXT"
       NAME = "fieldMusik"
       SIZE = "40">
</FORM>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   function info() {
      for (var i = 0; i < 4; i++)
         if (document.formTes.radioMusik[i].checked)
            document.formTes.fieldMusik.value =
               document.formTes.radioMusik[i].value;
   }
//-->
</SCRIPT>
</BODY>
</HTML>


  • objek password

<HTML>
<HEAD>
<TITLE>Mengakses Objek password</TITLE>
</HEAD>
<BODY>
<FORM NAME = "formTes"
      ACTION = "tesform.htm"
      METHOD  = "POST">
<PRE>
Password Pengganti  : <INPUT TYPE = "PASSWORD"
       NAME = "password_1">
Password Sekali Lagi: <INPUT TYPE = "PASSWORD"
       NAME = "password_2">
</PRE>
<INPUT TYPE = "BUTTON"
       NAME = "tombolProses"
       VALUE = "Proses"
       onClick = "cekPassword()">
</FORM>
<SCRIPT LANGUAGE = "JavaScript">
<!--
   function cekPassword() {
      if (document.formTes.password_1.value !=
          document.formTes.password_2.value)
         alert("Dua password yang Anda masukkan tidak sama");
      else
         window.location.href = "tesform.htm";
   }
//-->
</SCRIPT>
</BODY>
</HTML>























di

1 komentar:

Langganan: Posting Komentar (Atom)

TUGAS 3 JAVASCIRPT

  Menggunakan tag <SCRIPT>   <HTML> <HEAD> <TITLE>Contoh Program Javascript</TITLE> </HEAD...