HTML script tag | belajar <script> element

HTML Fadlullah Fadul December 3, 2018

Referensi Belajar HTML script tag. Tutorial dan panduan mengenai element <script>...</script> yang digunakan untuk menulis script di dalam HTML atau merujuk file script eksternal. Mencakup pembahasan lebih detail dan lengkap yang disertai contoh kode penggunaan sebagai rujukan untuk materi belajar HTML elemen <script>.

Deskripsi
Penjelasan HTML script tag

HTML <script> element digunakan untuk menulis script, atau lebih tepatnya adalah untuk menyisipkan script (seperti JavaScript) pada sisi client, baik itu ditulis secara langsung di dalam element <script>, maupun merujuk sumber file eksternal dengan attribute src.

Jika src attribute disebutkan (ditulis), maka <script> element, harus kosong (tidak boleh berisi konten apapun). Begitu juga sebaliknya, apabila script (javascript) tersebut ditulis langsung didalam element <script>, maka src attribute tidak boleh disebutkan.

<script> tanpa attribute async atau defer akan dijalankan (dieksekusi) secara langsung sebelum browser melanjutkan mengurai konten pada halaman tersebut (untuk lebih jelasnya, lihat pada attribute async dan defer).

Attributes
Atribut HTML Tag <script>

async Attribute

Menunjukkan asynchronously yang berarti tidak serempak. Attribute ini digunakan untuk menentukkan bahwa script akan dieksekusi sedangkan konten (halaman) akan terus dibaca/diurai (parse), sehingga berjalan masing-masing. Attribute ini berlaku untuk eksternal script.

Value: async

charset Attribute

Menentukkan character encoding yang digunakan pada file eksternal script.

Value: charset

defer Attribute

defer berarti tunda atau menangguhkan. Attribute ini digunakan untuk menangguhkan (menunda) script supaya tidak dijalankan terlebih dahulu sebelum halaman selesai dibaca atau dimuat.

Value: defer

src Attribute

Menentukkan link (URL) yang merujuk pada sumber file script external.

Value: URL

type Attribute

Menentukkan tipe media yang digunakan untuk script tersebut.

Value: media_type

Global Attributes
Atribut Secara Global (Keseluruhan)

<script> tag mencakup global attributes.

Event Attributes
Atribut event (Peristiwa)

<script> tag mencakup event attributes.

Attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Silahkan, lihat referensi mengenai HTML Events Attribute

Example
Contoh Bagaimana Menulis Script di dalam HTML?

Bagaimana menysisipkan script (javascript) di dalam HTML? Lihat contoh dibawah ini, kemudian Anda dapat memasukkannya diantara element <head> dan </head> ataupun diantara element <body> dan </body>. Untuk lebih jelasnya, Anda dapat melihat sumber kode pada contoh lengkap demo editor di bawah.

Contoh HTML <script> tag - Internal Script:

HTML 
<script>
  document.write("Selamat datang");
</script>

Contoh HTML <script> tag - External Script:

HTML 
<script src="nama-script.js"></script>

Di dalam HTML5 Anda dapat menambahkan type attribute hanya sebagai pilihan opsional, tetapi dalam HTML4 dan (x)HMTL, attribute ini wajib ditulis. Contoh:

HTML 
<script type="text/javascript" src="nama-script.js"></script>

Contoh Lengkap

Contoh source code lengkap disertai dengan link "editor" untuk mencoba (try it) dan melihat hasil (preview) kode.

SOURCE
editor 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title>Demo HTML script tag</title>
  </head>
  <body>
    <p>Kalimat dibawah ini, ditulis dengan javascript:</p>
    <div id="contoh"></div>

    <script>
      document.getElementById('contoh').innerHTML = "<h3>Selamat Datang</h3>";
      document.write("di apacara.com");
    </script>
  </body>
</html>
SHARE
Previous Article Next Article