30 June 2020

Membuat Function Javascript Pada File .JS Yang Terpisah Dari Halaman Utama

www.niguru.com
Niguru.com | Selasa, 30 Jun 2020 | Pada posting sehari sebelumnya, Niguru.com sudah menjelaskan mengenai cara untuk membuat function pada JS (Javascript). Dengan penggunaan function maka berbagai instruksi yang digunakan berulang kali cukup dituliskan sekali saja, dan bisa digunakan berkali-kali.

Salah satu keunggulan JS adalah ketersediaan fasilitas untuk menuliskan function pada file yang terpisah dengan ekstensi /extension .JS.

Berikut ini contohnya:

Ketikkan instruksi berikut ini pada Notepad:

 

function salamPerkenalan(a){
document.write(a," di website Niguru.com")
}

 

Simpan dengan nama ujiCoba.js (boleh menggunakan nama lain):

 
Berikut ini menggabungkan instruksi HTML yang berada di luar area JS (Javascript), dan menggunakan perintah untuk menggunakan instruksi:
<script language="javascript" src="ujiCoba.js"></script>  untuk menggabungkan instruksi yang ditulis pada file ujiCoba.js pada instruksi HTML ini:

<big><big><big>


<script language="javascript" src="ujiCoba.js"></script> 

<script language="javascript">
salamPerkenalan("Selamat datang")
</script>

 

 

Simpan dengan nama LatihanJS05.html (boleh menggunakan nama lain):

 

Hasilnya:

Didalam file ujiCoba.js boleh ditempatkan beberapa function sekaligus. Tambahkan function pada ujiCoba.js:

 

function salamSapa(){
document.write("<h1>Halo apa kabar?")
}
 


 
 

Untuk mencobanya, buat lagi sebuah file HTML dengan mengetikkan instruksi berikut ini:


<script language="javascript" src="ujiCoba.js"></script>

<script language="javascript">
salamSapa()
</script>

<script language="javascript">
salamPerkenalan("<h1>Mari belajar")
</script>


 

Simpan dengan nama LatihanJS06.html (boleh menggunakan nama lain):

 

Hasilnya:



Demikianlah contoh-contoh pembuatan web page, dengan menggunakan JS (Javascript) dengan function yang dibuat dalam file terpisah.
Selamat mencoba .. Have a nice day :-)

www.Niguru.com (Nino Guevara Ruwano)

No comments:

Post a Comment