Add Id To Element Javascript

MUAZHAN

3 min read

·

Jun 22, 2024

28

Share

Cara Menambahkan ID ke Elemen dengan JavaScript

Di dalam pengembangan web, seringkali kita perlu memanipulasi elemen HTML secara dinamis menggunakan JavaScript. Salah satu manipulasi yang umum adalah menambahkan ID ke elemen.

Cara Menambahkan ID Menggunakan setAttribute

Metode setAttribute memungkinkan kita untuk menambahkan atau mengubah atribut pada elemen HTML. Untuk menambahkan ID, kita dapat menggunakan kode berikut:

const element = document.getElementById("myElement"); 
element.setAttribute("id", "newId");

Penjelasan:

1. document.getElementById("myElement"): Mendapatkan elemen HTML dengan ID "myElement".
2. element.setAttribute("id", "newId"): Menambahkan atribut id dengan nilai "newId" ke elemen yang dipilih.

Cara Menambahkan ID Menggunakan id Property

Metode ini lebih mudah digunakan jika kita ingin mengubah nilai ID yang sudah ada.

const element = document.getElementById("myElement"); 
element.id = "newId";

Penjelasan:

1. document.getElementById("myElement"): Mendapatkan elemen HTML dengan ID "myElement".
2. element.id = "newId": Mengubah nilai atribut id menjadi "newId" pada elemen yang dipilih.

Contoh Implementasi

  
Ini adalah paragraf.

  

Kode di atas akan mengubah ID paragraf dari "myParagraph" menjadi "newParagraph" dan menampilkan nilai ID yang baru dalam konsol.

Catatan

• Pastikan ID yang Anda tambahkan unik dan tidak digunakan oleh elemen lain di halaman HTML.
• Anda dapat menambahkan ID ke elemen HTML apa pun, seperti <div>, <span>, <p>, dan lain-lain.

Dengan memahami cara menambahkan ID ke elemen HTML menggunakan JavaScript, Anda dapat memanipulasi struktur dan perilaku halaman web Anda dengan lebih fleksibel.