HTML adalah bahasa yang digunakan untuk menentukan apa saja isi dari sebuah halaman website, seperti header, paragraf, atau bahkan input dan "button".

Sementara Javascript adalah bahasa pemrograman yang digunaan untuk mengatur perilaku dari sebuah website. Lalu bagaimana cara menghubungkan keduanya.

Fungsi getElementById() adalah salah satu fungsi yang bisa digunakan untuk menghubungkan element HTML dengan javascript. Fungsi ini digunakan untuk mengedit isi element dengan "id" tertentu.

Pada halaman HTML, "id" adalah hal yang harus unik atau berbeda satu sama lain. Anda tidak diperbolehkan menggunakan "id" yang sama berulangkali dalam website. Anda hanya diperbolehkan menggunakannya satu kali dalam satu halaman website. Jadi, pada saat anda menggunakan fungsi getElementById() anda hanya bisa mengubah satu element dengan "id" tersebut.

Berikut ini contoh penggunaan fungsi getElementById()

Pada contoh di atas, menggunakan variabel untuk menyimpan "id" tersebut untuk bisa digunakan lagi di lain tempat. Pada variabel "a" sudah tersimpan alamat id "coba".

Misalnya pada element dengan id tersebut, akan dituliskan "Hello World" maka baris selanjutnya adalah sebagai berikut.

Method "innerText" digunakan untuk mengatur ulang text di dalam suatu element. Jadi, jika element sudah terisi text maka text tersebut akan digantikan dengan text baru dari method "innerText".

Anda juga bisa menuliskannya dalam satu baris seperti berikut

Cara pertama lebih disarankan untuk digunakan, yaitu menyimpan "id" pada sebuah variabel. Salah satu pertimbangannya adalah ketika "id" tersebut digunakan cukup sering pada javascript, akan sangat menyusahkan jika ada perubahan pada "id" tersebut karena anda harus mengubah semuanya. Jika menggunakan variabel anda hanya mengganti satu baris program saja.

Sekian penjelasan dari kami mengenai cara menghubungkan HTML dan javascript.

Lihat juga dan .

Sekian, Semoga bermanfaat