Mengakses Atribut HTML Menggunaan DOM

Mendapatkan dan memodifikasi atribut dalam suatu elemen HTML adalah diantara banyaknya kemampuan yang dimiliki oleh DOM.

Hanya dengan menggunakan sebagian kecil metode yang disediakan oleh DOM memungkinkan anda mendapatkan lebar dari IMG, mengubah lokasi IMG, atau bahkan menghapus atribut IMG, misalnya.

DOM telah menyediakan tiga metode yang bisa digunakan untuk mengakses atribut suatu elemen HTML. Tiga metode itu:

getAttribute()
getAttribute() digunakan untuk mendapatkan nilai suatu atribut. Jika atribut itu tidak ada, string kosong dikembalikan. Sebagai contoh jika ada penggambaran IMG seperti berikut:

<img id="imgID" src="image.gif">

Ketika saya ingin mengembalikan nilai SRC dari IMG, berikut kodenya:

var getValAttr = document.getElementById("imgID").getAttribute("src");

setAttribute()
setAttribute() akan berguna menetapkan atribut beserta nilai yang baru kepada suatu elemen, bahkan bisa digunakan secara dinamis memodifikasi nilai suatu atribut.

setAttribute() mempunyai dua parameter, parameter pertama digunakan untuk menetapkan nama atribut dan parameter yang kedua digunakan untuk menetapkan nilai untuk parameter yang pertama.

Sebagai contoh ketika saya ingin menetapkan WIDTH untuk IMG pada contoh sebelumnya, berikut kodenya:

var setWidth = document.getElementById("imgID").setAttribute("width", "500");

removeAttribute()
Menggunakan removeAttribute() memungkinkan anda menghapus atribut di dalam suatu elemen HTML.

Sebagai contoh jika saya ingin menghapus atribut SRC dari IMG pada contoh sebelumnya, berikut kodenya:

var remSrc = document.getElementById("imgID").removeAttribute("src");