Metode HTML DOM setAttribute()
Objek ElemenContoh
Tambahkan atribut class dengan nilai "democlass" ke elemen <h1>:
document.getElementsByTagName("H1")[0].setAttribute("class", "democlass");
Sebelum mengatur atribut:
Hello World
Setelah mengatur atribut:
Hello World
Lebih banyak contoh "Coba Sendiri" di bawah ini.
Definisi dan Penggunaan
Metode setAttribute() menambahkan atribut yang ditentukan ke elemen, dan memberinya nilai yang ditentukan.
Jika atribut yang ditentukan sudah ada, hanya nilainya yang disetel/diubah.
Catatan: Meskipun dimungkinkan untuk menambahkan atribut gaya dengan nilai ke elemen dengan metode ini, disarankan agar Anda menggunakan properti objek Gaya alih-alih untuk penataan sebaris, karena ini tidak akan menimpa properti CSS lain yang mungkin ditentukan di atribut gaya:
Buruk:
element.setAttribute("style", "background-color: red;");
Bagus:
element.style.backgroundColor = "red";
Tip: Gunakan metode removeAttribute() untuk menghapus atribut dari sebuah elemen.
Tip: Lihat juga metode setAttributeNode() .
Dukungan Peramban
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung metode ini.
Method | |||||
---|---|---|---|---|---|
setAttribute() | Yes | 8.0 | Yes | Yes | Yes |
Sintaksis
element.setAttribute(attributename, attributevalue)
Nilai Parameter
Parameter | Type | Description |
---|---|---|
attributename | String | Required. The name of the attribute you want to add |
attributevalue | String | Required. The value of the attribute you want to add |
Detail Teknis
Nilai Kembali: | Tidak ada nilai kembali |
---|---|
Versi DOM | Objek Elemen Level 1 Inti |
Lebih Banyak Contoh
Contoh
Ubah bidang input menjadi tombol input:
document.getElementsByTagName("INPUT")[0].setAttribute("type", "button");
Sebelum mengatur atribut:
Setelah mengatur atribut:
Contoh
Tambahkan atribut href dengan nilai "www.w3schools.com" ke elemen <a>:
document.getElementById("myAnchor").setAttribute("href", "https://www.w3schools.com");
Sebelum mengatur atribut:
Setelah mengatur atribut:
Contoh
Cari tahu apakah elemen <a> memiliki atribut target. Jika demikian, ubah nilai atribut target menjadi "_self":
// Get the <a> element with id="myAnchor"
var x = document.getElementById("myAnchor");
// If the <a> element has a target attribute, set the value to "_self"
if (x.hasAttribute("target")) {
x.setAttribute("target", "_self");
}
Halaman Terkait
Tutorial HTML: Atribut HTML
Referensi DOM HTML: Metode getAttribute()
Referensi DOM HTML: Metode hasAttribute()
Referensi DOM HTML: Metode removeAttribute()
Objek Elemen