Kamis, 19 Januari 2017

Penulisan dan Cara Penggunaan JavaScript


Assallamuallaikum Wr Wb,.
Setelah sebelumnya saya membahas pengertian dan pengenalan javascript sekarang kita akan menginjak ke Penulisan Dan Cara Penggunaan Javascript . Seperti yang sudah dijelaskan pada artikel sebelumnya. Javascript berfungsi untuk membuat interaksi pada halaman website atau aplikasi yang dibangun berdasarkan website. Dan pada tutorial kali ini akan dijelaskan cara Penulisan dan Penggunaan javascript.

CARA PENULISAN JAVASCRIPT
Kita mulai dengan penulisan syntax javascript yang baik dan benar. Dan adapun pengetahuan dasar mengenai javascript yang harus kita kuasai.

  • Disimpan dengan ektensi .js
  • Syntax javascript yang disisipkan pada halaman HTML ditulis dalam tag <script>
  • Syntax javascript dapat diletakkan pada dibagian element tag <head> atau <body>
  • Javascript bersifat case sensitive
  • Disetiap akhir baris ditutup dengan titik koma.semicolon ( ; )
Syntax javascript dapat digunakan dengan 2 cara. Yaitu dengan cara disisipkan pada halaman HTML langsung, dan 1 lagi dengan cara menyimpan file javascript dengan ektensi .js dan kemudian menginclude nya pada halaman HTML. Agar lebih spesifik akan kita bahas satu persatu.

MENGGUNAKAN JAVASCRIPT SECARA INTERNAL
Penulisan javascript secara internal adalah dengan cara menyisipkan langsung syntax javascript didalam HTML. jika sobat menggunakan cara ini maka syntax javascriptnya harus sobat letakkan diantara tag <script> pembuka dan tag <script> penutup. Dan meletakkanya bisa didalam tag <head>, dan bisa juga didalam tag <body> Unutk contoh buatlah file HTML untuk mengetahui cara kerja/penulisan javascript secara internal. Bisa file html bisa juga file php. Karena javascript mampu berjalan diantara keduanya. Disini saya hanya membuat file html sebagai contoh. Buatlah file html yang berekentsi  .html disini saya menggunakan nama belajar1.html

<!DOCTYPE html>
<html>
<head>
    <title>Javascript : Penulisan dan Cara penggunaan </title>
</head>
<body>
    <h1>Cara Penulisan Javascript</h1>
   
    <div id="nama"></div>

</body>
    <script>
        document.getElementById("nama").innerHTML = "Belajar JavaScript";    
    </script>
</body>
</html> 


Perhatikan pada contoh diatas. terdapat sebuah element div yang kita beri id  "nama" . Lalu kita berikan sentuhan Javascript  dengan perintah berikut


document.getElementById("nama").innerHTML = "Belajar JavaScript "; 

Document adalah syntax wajib di javascript, dan fungsi getElementById berfungsi untuk memerintahkan mendapatkan element yang memiliki id yang sesuai dengan isi didalam parameter getElementById itu sendiri. Penulisan besar kecil harus diperhatikan. Karena Javascript bersifat case sensitive dan innerHTML berfungsi untuk menuliskan HTML Jadi secara lengkap kita menyerukan untuk menulis "Nama Saya Yogi" di element yang ber id "nama". Jika dijalankan pada web browser hasilnya seperti berikut :

Hasil Run
MENGGUNAKAN JAVASCRIPT SECARA EXTERNAL
Setelah membahas penulisan javascript secara internal yaitu menyisipkan langsung syntax javascript pada html, kini kita akan membahas cara penulisan javascript lainya yaitu secara external . Buatlah dua file yang berektensi .html dan .js . Sebagai contoh saya memberi nama :
  • index.html
  • belajar.js
Pada file index.html kita akan menuliskan syntax HTML nya saja dan pada belajar.js kita menuliskan syntax javascriptnya. Dan agar kedua file tersebut terhubung kita dapat menggunakan syntax berikut :

<script src="java.js" type="text/javascript"></script>   

index.html

<!DOCTYPE html>
<html>
<head>
    <title>Javascript : Penulisan dan Cara penggunaan </title>
</head>
<body>
    <h1>Cara Penulisan Javascript</h1>
    <div id="nama"></div>

</body>
<script type="text/javascript" src="java.js"></script>
</body>
</html>

java.js
 
document.getElementById("nama").innerHTML = "Belajar JavaScript";

Hasil Run

KESIMPULAN
Kita dapat menggunakan 2 metode penulisan Javascript yaitu dengan cara internal dan external. metode Internal yaitu dengan cara meletakkan script Javascript di dalam file html. Metode External yaitu dengan cara membuat file javascript sendiri dan kita hubungkan file html tersebut dengan javascript


EmoticonEmoticon