Cara menggunakan javascript pada html

Question

Ada beberapa cara membuat javascript di html agar dapat berjalan, di dalam tutorial ini akan dibahas bagaimana cara membuat javascript di html agar dapat di tambahkan di halaman web kita.

Table of Contents Show

Manfaat, Fungsi & Peran JavaScript
Contoh Penggunaan Javascript
Catatan Tambahan
Bagaimana cara yang benar untuk menggunakan file JavaScript di HTML?
Bagaimana cara menjalankan JavaScript?
Script dari JavaScript dapat ditempatkan pada bagian apa di HTML?
Manakah script yang digunakan untuk memanggil file JavaScript?

Javascript menggunakan tag html <script> sebagai pembuka dan </script> sebagai penutup, nantinya kode-kode javascript dapat di masukkan di antara kedua tag pembuka dan penutup tersebut.

Sebelumnya cara membuat javascript kebanyakan menggunakan atribut type, yaitu type=”text/javascript” namun pada dasarnya javascript adalah bahasa bawaan dari web browser, sehingga dengan atau tanpa atribut tersebut seharusnya tidak masalah.

Berikut ini adalah beberapa cara membuat javascript di html agar dapat di jalankan di halaman website, masing-masing cara dibawah ini memiliki kelebihan dan kekurangannya.

Cara 1 menyisipkan javascript di tag head

Cara pertama adalah dengan menyisipkan di antara tag <head> dan </head>.

<!DOCTYPE html>
<html>
<head>
     <script type="text/javascript">
          // Kode anda
     </script>
</head>
<body>

</body>
</html>
Code language: HTML, XML (xml)

Cara dia atas adalah cara sering sering di gunakan oleh developer, karna letaknya ada di bagian atas sehingga tidak perlu scroll kode kebagian lain. Namun kekurangannya adalah berpengaruh pada kecepatan load website anda, mungkin jika kode javascript anda tidak terlalu banyak tidak masalah, tapi jika sudah banyak tentunya sangat terasa.

Cara 2 sebelum penutup tag body

Cara kedua adalah sebelum penutup tag </body>

<!DOCTYPE html>
<html>
<head>

</head>
<body>

     <script type="text/javascript">
          // Kode anda
     </script>
</body>
</html>
Code language: HTML, XML (xml)

Cara kedua ini mungkin agak sedikit merepotkan kerena setiap kali kita ingin mengubah atau menambah beberapa baris kode maka perlu scroll ke bawah teks editor anda, namun ini adalah cara yang baik karna kecepatan load anda mungkin tidak terganggu dimana website akan load seluruh dokumen html setelah itu baru mengeksekusi kode javascript.

Cara 3 meng-embed file javascript

Meng-embed file javascript terpisah dari file html

<script src="lokasi_file.js"></script>
Code language: HTML, XML (xml)

Kode embed di atas anda dapat letakan di antara tag <head></head> atau sebelum tag penutup </body>, cara ini lebih bersih, sehingga kode html dan javascript anda terpisah.

Cara-cara diatas bisa digunakan sesuai dengan kebutuhan, tinggal dipilih saja berdasarkan efesiensi penulisan kode program yang ingin dibuat.

Menurut wikipedia, JavaScript adalah bahasa skrip yang populer di internet dan dapat bekerja di sebagian besar penjelajah web populer seperti Internet Explorer (IE), Mozilla Firefox, Netscape dan Opera. Kode JavaScript dapat disisipkan dalam halaman web menggunakan tag SCRIPT.

Javascript adalah sebuah bahasa komputer atau kode pemrograman yang digunakan pada website agar website tersebut menjadi lebih interaktif dan dinamis. Javascript adalah jenis bahasa pemrograman client side. Penggunaan kode javascript pada sebuah website bersifat opsional, artinya tidak harus selalu ada. Namun, website-website maupun blog modern saat ini hampir semuanya menggunakan kode javascript walaupun sedikit. Hal ini karena tanpa javascript, sebuah website bagaikan sayur tanpa garam :D.

Manfaat, Fungsi & Peran JavaScript

Seperti yang disebutkan diatas, javascript berfungsi membuat sebuah halaman website lebih interaktif dan dinamis. Penggunaan kode javascript sangat dibutuhkan untuk website-website yang berorientasi pada kenyamanan pengakses (user-experience). Namun, penggunaan kode javascript ini tidak akan maksimal jika tidak dibarengi dengan penggunaan css karena javascript juga tidak akan lepas dari html.

Ketiga bahasa pemrograman itu sangat erat kaitannya. Jika saya ibaratkan sebuah website adalah rumah, maka kode html adalah segala yang membangun dan ada dirumah tersebut (tembok, tiang, atap, pondasi, ruang keluarga, kamar, dapur, peralatan rumah tangga, dan sebagainya). Lalu, kode css adalah pengatur dan penghias rumah tersebut(tata letak, warna dan sebagainya). Dan peran javascript bisa sebagai ‘pembantu’ kode css agar pengaturan dan hiasannya lebih bagus dengan tambahan pernak-pernik misalnya. Bisa juga untuk memanipulasi kode html dengan nama/identitas tertentu. Manipulasi ini bisa berupa menyembunyikan, menganti bahkan menambahkan elemen html yang baru.

Tanpa javascript, saat melakukan aksi tertentu, misalnya meng-klik pada sebuah halaman website, maka hasil atau respon dari hasil klik tersebut harus dimuat pada halaman lain. Hal ini tentunya sangat merepotkan karena tidak setiap aksi klik menghasilkan hasil/output yang besar/banyak. Terkadang hasil sebuah aksi hanyalah sebuah kalimat “Anda berhasil memasukkan data”, misalnya.

Contoh Penggunaan Javascript

Jika kata-kata dan penjelasan diatas belum membuat anda mengerti juga, maka seharusnya praktek penggunaannya bisa membuat mengerti. Jika tidak juga, maka anda memang … (isi sendiri :D).

Oke, berikut ini adalah contoh penggunaan kode javascript yaitu dengan membuat “alert”.

<script type="text/javascript">
function simsalabim() {
alert("Simsalabim, blah blah blah");
}
</script>
<button onclick="simsalabim()">Klik Untuk Melihat Demo</button>

Karena penggunaan javascript diatas masih sederhana, anda juga bisa menuliskan fungsi diatas seperti dibawah ini :trailer film Rough Night

<button onclick="alert("Simsalabim, blah blah blah");">Klik Untuk Melihat Demo</button>

Namun, penulisan javascript diatas hanya untuk fungsi yang sederhana saja.

Nah, hasil dari kedua kode diatas adalah sebagai berikut :

function simsalabim() { alert(“Simsalabim, blah blah blah”); }

Bagaimana? mudah bukan.

Catatan Tambahan

Hampir semua website saat ini menggunakan javascript, tapi ketahuilah bahwa pengakses website bisa mematikan fitur javascript pada browsernya, sehingga website yang diakses akan tampil sebagaimana tampil tanpa javascript. Hal ini bisa membuat tampilan website anda acak-acakan jika anda terlalu bergantung pada kode javascript untuk mendesainnya.
Penggunaan javascript yang terlalu banyak dan tidak rapi dapat membuat loading website anda lambat dan berat. Jadi, gunakan sewajarnya.

Bagaimana cara yang benar untuk menggunakan file JavaScript di HTML?

Cara membuat JavaScript di HTML secara langsung Anda bisa langsung menambahkan JavaScript di HTML dengan menggunakan tag <script></script> yang mencakup semua kode JS yang Anda tulis. Kode JS yang bisa ditambahkan: di antara tag <head>

Bagaimana cara menjalankan JavaScript?

Mengaktifkan JavaScript di Google Chrome.

Buka Chrome di komputer Anda..

Klik. Setelan..

Klik Keamanan dan Privasi..

Klik Setelan situs..

Klik JavaScript..

Pilih Situs dapat menggunakan JavaScript..

Script dari JavaScript dapat ditempatkan pada bagian apa di HTML?

Kode JavaScript kebanyakan dituliskan dalam wujud fungsi yang ditempatkan di tag <head> yang dibuka dengan tag <script type="text/javascript"> .

Manakah script yang digunakan untuk memanggil file JavaScript?

Kode JavaScript di input menggunakan tag <script>. Tag <script> akan memberitahu web browser bahwa kode diantara tag tersebut bukanlah HTML, tetapi JavaScript.

kode javascript Kode javascript lengkap Belajar JavaScript Script HTML Website