2. MATERI JAVASCRIPT (1)
Pendahuluan
Sintaks Dasar
Penggunaan Javascript
Hirarki Objek Javascript
Function
3. PENDAHULUAN JAVASCRIPT
Client-side scripting
Bahasa scripting yang paling populer di Internet,
dapat berjalan di hampir semua browser
Didesain untuk menambah interaktifitas pada
halaman HTML
Interpreted language (tanpa kompilasi)
Free (tanpa membeli lisensi)
Javascript is not Java !
4. PENDAHULUAN JAVASCRIPT (2) : APA YANG
DAPAT DILAKUKAN JAVASCRIPT?
sebagai alat pemrograman bagi desainer HTML
dapat meletakkan teks dinamis pada halaman
HTML
document.write(“<h1>”+name+”</h1>”); {name
merupakan variable}
dapat bereaksi terhadap event
dapat membaca dan menulis elemen HTML
dapat digunakan untuk validasi data
dapat mendeteksi pengunjung browser
dapat membuat cookie
5. SINTAKS DASAR (1)
Case sensitive
<script language=”javascript”>
<!--
// pendefinisian variabel atau objek
/* statement-statement javascript */
//-->
</script>
<script type="text/javascript">
Komentar satu baris
<!--
// pendefinisian variabel atau objek
Komentar lebih dari satu baris /* statement-statement javascript */
//-->
</script>
6. SINTAKS DASAR (2)
Contoh :
<html>
<body>
<h1>My First Web Page</h1>
<script type="text/javascript">
document.write("<p> Hello World! </p>");
</script>
</body>
</html>
7. PENGGUNAAN JAVASCRIPT
1. Di dalam tag <body>
<html>
<body>
<h1>My First Web Page</h1>
Latihan:
Tukar baris kode berikut dan lihat
<p id="demo"></p> hasilnya di browser.
Apa yang terjadi dan mengapa?
<script type="text/javascript">
document.getElementById("demo").innerHTML=Date();
</script>
</body>
</html>
8. PENGGUNAAN JAVASCRIPT (2)
2. Di dalam tag <head>
Dieksekusi saat sebuah event terjadi
Event ditangani oleh sebuah fungsi
<head>
<script type="text/javascript">
function displayDate() {
document.getElementById("demo").innerHTML=Date();
}
</script>
</head>
<body>
<h1>My First Web Page</h1>
<p id="demo"></p>
<button type="button" onclick="displayDate()">Display Date</button>
</body>
9. PENGGUNAAN JAVASCRIPT (3)
3. File eksternal
Ekstensi : js
Dapat digunakan oleh banyak halaman web
<html>
<head>
<script type="text/javascript" src=”sample.js"></script>
</head>
<body>
</body>
</html>
Perhatikan lokasi penyimpanan file eksternal
10. HIRARKI OBJEK JAVASCRIPT
Dua tipe objek:
Language object
Disediakan oleh bahasa dan tidak bergantung pada objek lain
Navigator
Disediakan oleh browser, tergantung pada jenis browser yang
digunakan
11.
12.
13. Object Properties Methods Event Handler
Window frames , status, top,name alert, confirm, onLoad, onUnload,
prompt, close onBlur, onFocus
History length, forward, go back -
Navigator appCodeName, appName, javaEnabled -
appVersion, plugins
Documents alinkColor, anchors, open, close, write, -
bgColor, title
Image border, complete, height - -
Form action, elements, submit, reset onSubmit, onReset
FileUpload