0% menganggap dokumen ini bermanfaat (0 suara)
513 tayangan19 halaman

Pertemuan - Javascript

Javascript merupakan bahasa script yang ditempel pada HTML dan dijalankan di sisi klien. Bab ini memperkenalkan tentang sejarah Javascript, cara membuat program Javascript, menangani kesalahan sintaks, Javascript sebagai bahasa berorientasi objek, menangani input data, peringatan, dan dasar-dasar pemrograman seperti operasi aritmatika dan relasional, seleksi kondisi, pembuatan form dan tombol.

Diunggah oleh

Muhadi muhadi
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PPT, PDF, TXT atau baca online di Scribd
0% menganggap dokumen ini bermanfaat (0 suara)
513 tayangan19 halaman

Pertemuan - Javascript

Javascript merupakan bahasa script yang ditempel pada HTML dan dijalankan di sisi klien. Bab ini memperkenalkan tentang sejarah Javascript, cara membuat program Javascript, menangani kesalahan sintaks, Javascript sebagai bahasa berorientasi objek, menangani input data, peringatan, dan dasar-dasar pemrograman seperti operasi aritmatika dan relasional, seleksi kondisi, pembuatan form dan tombol.

Diunggah oleh

Muhadi muhadi
Hak Cipta
© © All Rights Reserved
Kami menangani hak cipta konten dengan serius. Jika Anda merasa konten ini milik Anda, ajukan klaim di sini.
Format Tersedia
Unduh sebagai PPT, PDF, TXT atau baca online di Scribd
Anda di halaman 1/ 19

JAVA SCRIPT

01/21/21
MATERI

Dalam pertemuan ini akan mempelajari tentang :


•Sekilas tentang Javascript
•Mengenal Program Javascript
•Mengenal Pesan Kesalahan
•Javascript sebagai Bahasa Berorientasi Objek
•Menangani Pemasukan Data
•Mengenal Jendela Peringatan
•Dasar-dasar pemrograman dengan Javascript

2
SASARAN

Setelah menyelesaikan bab ini, anda diharapkan


dapat:
• Mengerti tag-tag tentang Javascript
• Memahami tag-tag dalam membuat dan
menggunakan Javascript

3
SekilasTentang Javascript

Asal mula nama Javascript adalah Livescript. Dikembangkan


tahun 1995 di Netscape Communication. Akhir tahun 1995
Netscape Communications dan Sun Microsystem berkolaborasi
dan mengubah nama Livescript menjadi Javascript.
Javascript adalah Bahasa Script yang ditempel ke dalam HTML
dan di proses di sisi komputer client.
Javascript bukanlah bahasa Java dan merupakan bahasa yang
berbeda. Javascript diinterpretasikan oleh komputer client
sedangkan Java dikompilasi oleh pemrogram / programmer dan
hasil kompilasinylah yang dijalankan oleh komputer client.

4
Mengenal Program Javascript

Jalan termudah untuk memahami sesuatu adalah


dengan mempraktekkannya. Contoh :
<HTML>
<HEAD>
<TITLE>Skrip Javascrip</TITLE>
</HEAD>
<BODY>
<P>Percobaan memakai Javascript :<BR>
</P>

<SCRIPT LANGUAGE="Javascript">
<!--
document.write("Selamat Datang di Kampus Tercinta
<BR>");
document.write("Semoga Sukses !");

-->
</SCRIPT>
</BODY>
</HTML>
5
Mengenal Pesan Kesalahan

Berbeda dengan kode HTML yang tidak mengandung Javascript, kode


Javascript yang salah secara sintaks akan membuat browser menampilkan
kotak dialog yang menyatakan pesan kesalahan.

<SCRIPT LANGUAGE="Javascript">
<!--
DOCUMENT.write("Selamat Datang di Kampus
Tercinta <BR>");
DOCUMENT.write("Semoga Sukses !);

-->
</SCRIPT>
Javascript Sebagai
Bahasa Berorientasi Objek
Javascript tergolong sebagai bahasa berorientasi Objek . Pada bahasa
pemrograman seperti ini, objek merupakan dasar utama. Sebuah objek
tersusun atas properti, metode, dan penanganan kejadian. Ketiga istiah ini
perlu diketahui terlebih dahulu sebelum melangkah lebih jauh ke detail
Javascript.
Properti

Properti adalah atribut dari sebuah objek. Sebagai


contoh tinjaulah objek sebuah mobil. Salah satu objek
mobil adalah warna mobil. Pada contoh latihan1.html
tadi, document adalah sebuah objek bawaan pada
javascript. Objek yang lain dalam javascript yaitu
window.
Untuk mengakses sebuah properti, perlu penulisan
denganbentuk sebagai berikut :
Nama_objek.nama_properti
Tanda titik (.) adalah pemisah antara objek dan properti
<HTML>
<HEAD>
<TITLE>Skrip Javascrip</TITLE>
</HEAD>
<BODY>
<P>TES defaultStatus :<BR>
</P>

<SCRIPT LANGUAGE="Javascript">
<!--
window.defaultStatus="Selamat Belajar
Javascript";

-->
</SCRIPT>
</BODY>
</HTML>
Menangani Pemasukan Data
Javascript memiliki mekanisme yang memungkinkan pemakai disuguhi
jendela untuk memasukkan sederetan masukan dan setelah pemakai
mengklik tombol OK maka kode dalam Javascript akan melakukan
serangkaian proses.
Sebagai contoh skrip berikut akan meminta memasukkan nama Anda dan
Anda akan mendapatkan salam berupa :
Hai, Nama Anda ...
<HTML>
<HEAD>
<TITLE>Input Data dengan Javascrip</TITLE>
</HEAD>
<BODY>

<SCRIPT LANGUAGE="Javascript">
<!--
var nama = prompt("Siapa Nama Anda ? ");
document.write ("Hai Nama Anda :
"+ nama);
-->
</SCRIPT>
</BODY>
</HTML>
Mengenal Jendela Peringatan

Jika karena sesuatu hal Anda ingin memberikan pesan kepada


pemakai, Anda bisa sajikan dalam bentuk kotak dialog yang
disebut Alert Box. Hal ini bisa dilakukan dengan memberikan
pernyataan semacam berikut:
Window.alert (”Ini merupakan pesan untuk Anda !”)

<SCRIPT LANGUAGE="Javascript">
<!--
window.alert("Ini Merupakan pesan untuk
Anda !");
</SCRIPT>
Dasar-dasar Pemrograman Javascript

1. Operasi Dasar Aritmatika


<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD>
<SCRIPT language="Javascript">
function test (val1,val2)
{
document.write("<br>"+"Perkalian : val1*val2 "+"<br>")
document.write(val1*val2)
document.write("<br>"+"Pembagian : val1/val2 "+"<br>")
document.write(val1/val2)
document.write("<br>"+"Penjumlahan : val1+val2 "+"<br>")
document.write(val1+val2)
document.write("<br>"+"Pengurangan : val1-val2 "+"<br>")
document.write(val1-val2)
document.write("<br>"+"Modulus : val1%val2 "+"<br>")
document.write(val1%val2)
}
</SCRIPT>
<BODY>
<input type="button" name="button1" value="arithmetic" onclick=test(9,4)>
</BODY>
</HTML>
2. Operasi Relational

<HTML>
<HEAD>
<TITLE>Contoh Program Javascript</TITLE>
</HEAD> <SCRIPT language="Javascript">
function test () {
val1 = window.prompt("Nilai I :")
val2=window.prompt("Nilai II :")
document.write("<br>"+"val1==val2"+"<br>")
document.write(val1==val2)
document.write("<br>"+"val1!=val2"+"<br>")
document.write(val1!=val2)
document.write("<br>"+"val1&gtval2"+"<br>")
document.write(val1>val2)
document.write("<br>"+"val1&ltval2"+"<br>")
document.write(val1<val2)
}
</SCRIPT>
<BODY>
<input type="button" name="button1" value="relational"
onclick=test()>
</BODY>
</HTML>
3. Seleksi kondisi (if..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>
Pembuatan Form

<html>
<head>
</head>
<SCRIPT language="Javascript">
function test ()
{ var val1=document.kirim.T1.value
if (val1%2==0)
document.kirim.T2.value="bilangan genap"
else
document.kirim.T2.value="bilangan ganjil"
}
</SCRIPT>
<body>
<form method="POST" name="kirim">
<p>BIL <input type="text" name="T1" size="20">
MERUPAKAN BIL <input type="text" name="T2" size="20"> </p>
<p><input type="button" value="TEBAK" name="B1" onclick=test()> </p>
</form>
</body>
</html>
Form Button
<HTML>
<HEAD>
<TITLE>Objek document</TITLE>
</HEAD>
<BODY>
<SCRIPT LANGUAGE = "JavaScript">
<!--
function ubahWarnaLB(warna) {
document.bgColor = warna;
}
function ubahWarnaLD(warna) {
document.fgColor = warna; }
//-->
</SCRIPT>
<H1>TES</H1>
<FORM>
<INPUT TYPE = "BUTTON" VALUE = "Latar Belakang Hijau" onClick = "ubahWarnaLB('Ocean')">
<INPUT TYPE = "BUTTON" VALUE = "Latar Belakang Putih" onClick = "ubahWarnaLB('WHITE')">
<INPUT TYPE = "BUTTON" VALUE = "Teks Kuning" onClick = "ubahWarnaLD('YELLOW')">
<INPUT TYPE = "BUTTON" VALUE = "Teks Biru" onClick = "ubahWarnaLD('BLUE')">
</FORM>
<SCRIPT LANGUAGE = "JavaScript">
<!--
document.write("Dimodifikasi terakhir pada " + document.lastModified);
//-->
</SCRIPT>
</BODY>
</HTML>
TUGAS MANDIRI

1. Jelaskan pengertian tentang Javascript yang Anda ketahui


2. Fungsi apa saja yang dapat digunakan pada Javascript
3. Jelaskan perbedaan antara Bahasa Jaascript dengan Bahasa Java yang
Anda Ketahui
SELAMAT BELAJAR

19

Anda mungkin juga menyukai