Cara membuat JavaScrip langsung di HTML

Ada dua cara yang bisa dilakukan untuk membuat JavaScript di HTML; cara pertama dengan memasukkan kode JavaScript langsung ke dalam skrip HTML, cara kedua dengan membuat JavaScript di dalam file yang terpisah.

Cara Membuat JavaScript Langsung di HTML

Penambahan kode JavaScript langsung di dalam skrip HTML biasanya dimasukkan ke dalam tag <script> </script>. Hal ini bertujuan untuk memberikan sinyal bahwa kode yang ada di dalamnya adalah kode JavaScript. Tag yang digunakan untuk memanggil JavaScript biasanya ditambahkan di antara tag <head> atau di antara tag <body>.

index.html

<!DOCTYPE html>

 

<html lang=”en-US”>

<head>

   <meta charset=”UTF-8″>

   <meta name=”viewport” content=”width=device-width, initial-scale=1″>

   <title>Niagahoster</title>

</head>

<body>

</body>

</html>

Kode di atas merupakan contoh dari kode HTML yang belum mengandung baris kode JavaScript. Agar terlihat contoh bagaimana JavaScript bekerja, tambahkan baris perintah berikut ke dalam kode di atas.

var txt1 = “Niagahoster “;

 

txt1 += “Cara Membuat JavaScript di HTML – Niagahoster”;

alert(txt1)

Baris kode di atas digunakan untuk menampilkan kotak dialog yang berisi teks “txt1” pada halaman browser.

Agar HTML dapat membaca script JavaScript, maka langkah yang perlu dilakukan adalah dengan menambahkan kode di atas ke dalam tag <script>. Hasilnya kurang lebih seperti ini.

index.html

<!DOCTYPE html>

 

<html lang=”en-US”>

<head>

   <meta charset=”UTF-8″>

   <meta name=”viewport” content=”width=device-width, initial-scale=1″>

   <title>Niagahoster</title>

<script>

var txt1 = “Niagahoster “;

txt1 += “Cara Membuat JavaScript di HTML – Niagahoster”;

alert(txt1)    

</script>

</head>

<body>

</body>

</html>

Anda juga dapat menyesuaikan sesuai dengan kreatifitas masing-masing. Kurang lebih hasil dari skrip di atas akan memunculkan tampilan seperti ini.

cara membuat javascript di html - hasil javascript di head (1)
Ket: Hasil Inline JavaScript dengan HTML

Struktur skrip seperti di atas sudah jarang dipakai karena terkadang baris JavaScript digunakan berulang-ulang pada beberapa file. Di bawah ini adalah contoh cara membuat JavaScript di HTML menggunakan file yang terpisah.

cara membuat javascrip terpisah dengan html https://www.blogger.com/blog/post/edit/3331300254956594142/4757497130328544144

Komentar

Posting Komentar

Postingan populer dari blog ini

Cara Membuat JavaScript dan CSS dengan File Terpisah di HTML

Gambar
Cara Membuat JavaScript dan CSS dengan File Terpisah di HTML Supaya lebih mudah untuk memahami bagaimana cara membuat JavaScript di HTML dengan file terpisah, kita akan membuat folder untuk menyimpan file JavaScript terlebih dahulu. Strukturnya akan menjadi “root/js/script.js”. Pada script.js akan diisi dengan skrip JavaScript. index.html <!DOCTYPE html>   <html lang=”en-US”> <head>    <meta charset=”UTF-8″>    <meta name=”viewport” content=”width=device-width, initial-scale=1″>    <title>Niagahoster</title> </head> <body> <script src=”js/script.js”></script> </body> </html> Sedangkan di dalam file  script.js  isi skripnya seperti di bawah ini. script.js var txt1 = “Niagahoster “;   txt1 += “Cara Membuat JavaScript di HTML – Niagahoster”; document.body.innerHTML = “<h1>” + txt1 + “</h1>” Pada tabel dia atas, index.html akan memanggil ...
Baca selengkapnya

Pengertian dan Fungsi Samba Server

Pengertian dan Fungsi Samba Server – Apakah anda pernah mendengar istilah Samba Server atau apa fungsi Samba Server ? Pada artikel kali saya akan berbagi teori singkat mengenai  Pengertian dan Fungsi Samba Server . Kutipan sederhana dari situs Wikipedia :  Samba adalah program yang bersifat open source yang menyediakan layanan berbagi berkas (file service) dan berbagi alat pencetak (print service), resolusi nama NetBIOS, dan pengumuman layanan (NetBIOS service announcement/browsing). Sebagai sebuah aplikasi file server, Samba mengizinkan berkas, alat pencetak, dan beberapa sumber daya lainnya agar dapat digunakan oleh banyak pengguna dalam keluarga sistem operasi UNIX, dan mengizinkan interoperabilitas dengan sistem operasi Windows Dalam hal untuk proses berbagi data atau penggunaan layanan data secara bersama-sama, kita tidak hanya terbatas bisa menggunakan protokol FTP (File Transfer Protokol) yang sudah pernah saya bahas sebelumnya pada artikel  Cara Membuat FTP Ser...
Baca selengkapnya

Pengertian dan Fungsi PHP

  PHP  (PHP: Hypertext Preprocessor)   adalah sebuah bahasa pemrograman   server side scripting   yang bersifat   open source . Sebagai sebuah scripting language, PHP menjalankan instruksi pemrograman saat proses runtime. Hasil dari instruksi tentu akan berbeda tergantung data yang diproses. PHP merupakan bahasa pemrograman server-side, maka script dari PHP nantinya akan diproses di server. Jenis server yang sering digunakan bersama dengan PHP antara lain  Apache ,  Nginx , dan  LiteSpeed .  Selain itu, PHP juga merupakan bahasa pemrograman yang bersifat open source. Pengguna bebas memodifikasi dan mengembangkan sesuai dengan kebutuhan mereka. Tentunya jika memiliki kemampuan coding yang baik, ya?  Mengapa Menggunakan PHP? Saat ini, tak kurang dari  78% website  di seluruh dunia menggunakan bahasa pemrograman yang diciptakan Rasmus Lerdorf di tahun 1995 ini. Bahkan platform besar seperti  Facebook  juga menggunak...
Baca selengkapnya