HTML Programming 8 - Javascript
Assalamu'alaikum
Selamat pagi, salam programming!!. Berjumpa lagi di pembahasan programming html. Kali ini saya ingin membahas mengenai javascript pada html. Karena yang di bahas adalah javascript, maka di dalam html akan banyak bahasa java yang di inject secara inline di dalam tag script language javascript dan tentu di kombinasikan untuk di lakukan output ke dalam script sebuah aplikasi website yaitu html.
Latar Belakang Javascript
Pada mulanya, script javascript merupakan penggembangan dari bahasa pemrograman java. Dimana java ini di kembangkan oleh sunmicrosystem yang bahasa java sendiri merupakan pengembangan bahasa c++. Pada java, beban pemrosesan di bebankan ke client. Sehingga beban server dapat di kurangi dengan program java. Dengan java, kita bisa menampilkan animasi bersuara dan menampilkan berbagai diagram (berkaitan dengan multimedia).
Dari latar belakang pengembangan bahasa java, netscape communication dan sun microsystem mengembangkan bahasa script yang di beri nama javascript. Pada dasarnya script tidak jauh berbeda dengan bahasa pemrograman biasa karena juga merupakan instruksi pemrograman. Bedanya, scripting tidak dilakukan kompilasi.
Karena javascript ini merupakan pengembangan bahasa java, javascript ini tidak jauh berbeda dengan bahasa pemrograman java. Saya sarankan terlebih dahulu kalian kuasai bahasa pemrograman java terlebih dahulu agar logik untuk pembahasan java script ini bisa kalian pahami dengan baik.
About Javascript
Javascript sudah di kembangkan sejak tahun 1995. Di rilis ver 1.1 tahun 1996 dan ver 1.2 di tahun 1997. Sejak tahun 1996, javascript sudah di serahkan ke ECMA untuk di standarisasikan. Javascript termasuk bahasa yang berorientasi objek.
Penulisan tag javascript diapit oleh <script language = "Javascript"> ... </script>. Dimana di antara tag script tersebut penulisan perogram di apit oleh <!-- Program javascript //-->. Sehingga penulisan program javascript pada html akan terlihat seperti struktur berikut.
| <html> <head> <title> </title> </head> <body> <script language="Javascript"> <!-- program javascript //--> </script> </body> </html> |
Note : untuk penulisan script pada javascript bisa di singkat menjadi <script lang = "Javascript">.
Input Output Data di Javascript
Untuk latihan pertama, kita akan membuat program input dan output terlebih dahulu. Dimana latihan pertama ini kita akan mengambil entry data yang di inputkan user lalu menampilkan kembali entry data yang di inputkan tersebut ke tampilan browser. Dalam hal ini, kita membutuhkan sebuah variabel sebagai penampung data yang nantinya kita input.
Variabel pada javascript tidak perlu di deklarasikan tipe datanya. Pada javascript sendiri untuk mendeklarasikan suatu variabel hanya di butuhkan script var. Untuk melakukan script input, kita bisa menggunakan perintah prompt. Dan untuk melakukan output kita bisa menggunakan perintah document.write. Pada javascript, setiap instruksi yang ingin di eksekusi harus diakhiri dengan titik koma (;).
Variabel pada javascript tidak perlu di deklarasikan tipe datanya. Pada javascript sendiri untuk mendeklarasikan suatu variabel hanya di butuhkan script var. Untuk melakukan script input, kita bisa menggunakan perintah prompt. Dan untuk melakukan output kita bisa menggunakan perintah document.write. Pada javascript, setiap instruksi yang ingin di eksekusi harus diakhiri dengan titik koma (;).
| <html> <head> <title>Javascript | Jendela Memasukan Data | Mahasiswa Mercu Buana Bekasi Pemrograman Web Genap 2019 </title> </head> <body> <script language="Javascript"> <!-- var nama = prompt("Nama Anda : "); document.write("Hai, " + nama); //--> </script> <p align=center> © Mahasiswa Mercu Buana Bekasi Pemrograman Web Genap 2019 </p> </body> </html> |
Kira-kira hasilnya akan seperti contoh berikut.
Custom Input Button With Javascript
Selanjutnya custom input button. Custom input button ini biasa di jumpai di html tag form. Dimana custom button ini bisa di kustomisasi dengan menggunakan javascript. Custom button ini merupakan input type=button. Lalu bisa di arahkan ke variabel yang di inginkan atau jugga bisa memberikan action pada attribute onclick.
Semisal disini kita ingin custom button nya agar ketika di klik akan memunculkan pesan atau message tertentu. Maka pada attribute onclicknya kita berikan value "window.alert('mandi dulu sono');".
| <html> <head> <title>Javascript | Jendela Warning | Mahasiswa Mercu Buana Bekasi Pemrograman Web Genap 2019 </title> </head> <body> <input type=button value=pencet onclick="window.alert('mandi dulu sono');"> <p align=center> © Mahasiswa Mercu Buana Bekasi Pemrograman Web Genap 2019 </p> </body> </html> |
Kira-kira hasilnya akan seperti contoh berikut ini.
Operator Ternary di Javascript
Yang terkahir yang ingin saya bahas di pembahasan javascript ini adalah operator ternary. Sama seperti di bahasa pemrograman lainnya, operator ternary ini digunakan untuk membandingkan suatu kondisi benar atau salahnya. Operator ini melibatkan 3 buah operand yaitu operand kondisi, instruksi jika kondisi benar dan instruksi jika kondisi salah. Strukturnya yaitu
(kondisi) ? "Instruksi jika kondisi benar" : "instruksi jika kondisi salah";
Semisal disini saya ingin membandingkan kondisi berat badan. Kondisi yang saya berikan pada berat badan adalah lebih besar dari 100kg. Berikut contoh programmnya.
| <html> <head> <title>Javascript | Operator ? | Mahasiswa Mercu Buana Bekasi Pemrograman Web Genap 2019 </title> </head> <body> <script language="Javascript"> <!-- var berat = prompt("Berat badan anda : ",0); var hasil=(berat >= 100) ? "Segera diet, anda obesitas" : "Mantab triplek eaa"; document.write("Hasil = " + hasil); //--> </script> <p align=center> © Mahasiswa Mercu Buana Bekasi Pemrograman Web Genap 2019 </p> </body> </html> |
Kira-kira hasilnya akan seperti contoh berikut
Demikian pembahasan mengenai javacript di scripting html. Semoga bisa mudah kalian pahami. Sekian dari saya, jika ada yang ingin di tanyakan bisa di komentar. Terima kasih sudah berkunjung, sampai berjumpa di pembahasan berikutnya. Salam programming!!.
0 komentar:
Post a Comment