Pemrograman Web:Javascript 1: Difference between revisions
No edit summary |
No edit summary |
||
| (2 intermediate revisions by the same user not shown) | |||
| Line 43: | Line 43: | ||
|Juni 2017 | |Juni 2017 | ||
|} | |} | ||
Contoh membuat Hello World | Contoh membuat Hello World<syntaxhighlight lang="html" line="1"> | ||
<!DOCTYPE html> | |||
<html> | |||
<head> | |||
<title>Hello World Javascript</title> | |||
</head> | |||
<body> | |||
<script language="javascript"> | |||
document.write("Hello World!"); | |||
</script> | |||
</body> | |||
</html> | |||
</syntaxhighlight> | |||
== Cara Menulis Kode Javascript di HTML == | |||
Pada contoh di atas, sudah menulis kode javascript di dalam HTML. Cara tersebut merupakan cara penulisan embeded (ditempel). | |||
Masih ada beberapa cara lagi yang perlu di ketahui: | |||
# Embed (Kode Javascript ditempel langsung pada HTML. Contoh: yang tadi) | |||
# Inline (kode Javascript ditulis pada atribut HTML) | |||
# Eksternal (Kode Javascript ditulis terpisah dengan file HTML) | |||
=== Penulisan Kode javascript dengan Embed === | |||
Pada cara ini, menggunakan tag <script> untuk menempelkan (embed) kode Javascript pada HTML. Tag ini dapat ditulis di dalam tag <code><head></code> dan <code><body></code>. | |||
==== Contoh: ==== | |||
<syntaxhighlight lang="html"> | |||
<a href="#" onclick="alert('Yey!')">Klik aku!</a> | |||
</syntaxhighlight>atau bisa juga seperti ini:<syntaxhighlight lang="html"> | |||
<a href="javascript:alert('Yey!')">Klik aku!</a> | |||
</syntaxhighlight>Perhatikan… | |||
Pada atribut <code>onclick</code> dan <code>href</code> fungsi javascript di tuliskan di sana. | |||
Atribut <code>onclick</code> merupakan atribut HTML untuk menyatakan fungsi yang akan dieksekusi saat elemen itu diklik. | |||
Pada contoh di atas, di jalankan fungsi <code>alert()</code>. Fungsi ini merupakan fungsi untuk menampilkan dialog. | |||
Lalu pada atribut <code>href</code>, juga memanggil fungsi <code>alert()</code> dengan didahului <code>javascript:</code>. | |||
Atribut <code>href</code> sebenarnya digunakan untuk mengisi alamat link atau URL. | |||
Karena ingin memanggil kode javascript di sana, maka alamat link tersebut di ubah | |||
menjadi <code>javascript:</code> lalu diikuti dengan fungsi yang akan dipanggil. | |||
=== Penulisan Kode javascript Eksternal === | |||
Pada cara ini, akan menulis kode javascript secara terpisah dengan file HTML. | |||
Cara ini biasanya digunakan pada proyek-proyek besar, karena diyakini—dengan cara ini—dapat lebih mudah mengelola kode project. | |||
[[Category:Materi]] | |||
[[Category:Matkul]] | |||
[[Category:Pemrograman Web]] | |||