Menurut W3C, atribut ID di HTML adalah pengidentifikasi unik untuk elemen tersebut. Ini menyediakan cara untuk mengidentifikasi area halaman web untuk gaya CSS, tautan jangkar, dan target untuk skrip.
Untuk Apa Atribut ID Digunakan?
Atribut ID melakukan beberapa tindakan untuk halaman web:
- Pemilih lembar gaya: Ini adalah fungsi yang paling banyak digunakan orang untuk menggunakan atribut ID. Karena mereka unik, Anda hanya akan menata satu item di halaman web Anda saat Anda menata gaya menggunakan properti ID. Kelemahan menggunakan ID untuk tujuan penataan adalah memiliki tingkat kekhususan yang sangat tinggi, yang dapat membuatnya sangat menantang jika Anda perlu mengganti gaya untuk beberapa alasan nanti dalam a lembar gaya. Karena itu, praktik web saat ini cenderung menggunakan kelas dan pemilih kelas sebagai pengganti ID dan pemilih ID untuk tujuan penataan gaya umum.
- Bernama jangkar untuk menautkan ke: Peramban web menargetkan lokasi yang tepat di dokumen web Anda dengan menunjuk ke ID di akhir URL. Tambahkan id ke akhir URL halaman, didahului dengan tanda pagar. Tautkan ke jangkar ini dengan halaman itu sendiri dengan menambahkan tag hash dan nama ID di href atribut untuk elemen. Misalnya, untuk divisi dengan ID kontak, tautkan ke halaman itu dengan #kontak.
- Referensi untuk skrip: Jika Anda menulis fungsi Javascript, gunakan atribut ID sehingga Anda dapat membuat perubahan pada elemen yang tepat pada halaman dengan skrip Anda.
- Pemrosesan lainnya: Id mendukung pemrosesan dalam dokumen web Anda dengan cara apa pun yang Anda butuhkan. Misalnya, Anda dapat mengekstrak HTML ke dalam database dan menggunakan atribut ID untuk mengidentifikasi bidang.
Aturan Penggunaan Atribut ID
Pastikan atribut ID Anda sesuai dengan tiga standar berikut:
- ID harus dimulai dengan huruf (a-z atau A-Z).
- Semua karakter berikutnya dapat berupa huruf, angka (0-9), tanda hubung (-), garis bawah (_), titik dua (:), dan titik (.).
- Setiap ID harus unik dalam dokumen.
Menggunakan Atribut ID
Setelah Anda mengidentifikasi elemen unik dari situs web Anda, gunakan lembar gaya untuk menata hanya satu elemen itu.
Misalnya, untuk mengidentifikasi ID berjudul kontak, gunakan salah satu dari formulir ini:
div#kontak { latar belakang: #0cf;}
#kontak { latar belakang: #0cf;}
Sampel pertama menargetkan divisi dengan atribut ID kontak. Yang kedua masih menargetkan elemen dengan ID kontak, itu tidak akan menetapkan bahwa itu adalah divisi. Hasil akhir dari styling akan persis sama.
Anda juga dapat menautkan ke elemen tertentu tanpa menambahkan tag apa pun.
Referensikan paragraf itu dalam skrip Anda dengan getElementById Metode JavaScript:
document.getElementById("bagian kontak")
Atribut ID masih sangat berguna dalam HTML, meskipun pemilih kelas telah menggantikannya untuk sebagian besar tujuan penataan umum. Menggunakan atribut ID sebagai pengait untuk gaya, sementara juga menggunakannya sebagai jangkar untuk tautan atau target untuk skrip, berarti mereka masih memiliki tempat penting dalam desain web saat ini.