Atribut HTML id: Memberikan Identitas Khusus pada Elemen

Definisi dan penggunaan

Atribut id memberikan id unik pada elemen HTML. Atribut id umumnya digunakan untuk kebutuhan styling, scripting, atau linking. Atribut id merupakan salah satu Atribut global HTML.

Sintak

<elemen id='value'>

Keterangan

• value harus bersifat unik. Dengan kata lain, sebuah value untuk atribut id hanya bisa digunakan satu kali.
• value harus terdiri dari satu karakter atau lebih.
• value tidak mengandung spasi (spasi, tab, dll).

Dukungan browser

Chrome	Firefox	Safari	IE	Opera
Ya	Ya	Ya	Ya	Ya

Contoh-contoh

• Untuk keperluan styling Atribut id sering digunakan sebagai CSS selector.
  
  

  <p id='paragraf1'>Pragraf HTML<p>

  #paragraf1 {
     background:blue;
     color:#fff;
     padding:20px;
     text-align:center;
  }

  Paragraf HTML

• Untuk keperluan scripting Terkait javascript, atribut id digunakan untuk mempermudah proses pengambilan elemen yang bersangkutan.
  
  

  <p id='paragraf1'>Pragraf HTML<p>
  <a href='#' id='link1'>Alert text paragraf 1<a>

  #paragraf1 {
     background:blue;
     color:#fff;
     padding:20px;
     text-align:center;
  }
  
  #link1 {
     display:inline-block;
     margin-top:20px;
     background:#f6f7f8;
     color:#000;
     padding:10px 15px;
     line-height:1;
     border:1px solid #e0e0e0;
     border-radius:5px;
  }
  

     var paragraf = document.getElementById("paragraf1");
     var link = document.getElementById("link1");
         link.onclick = function(e){
            e.preventDefault();
            alert(paragraf.innerHTML);
         }

  Paragraf HTML

  Alert text paragraf
• Untuk keperluan linking Kita bisa membuat link untuk mengarahkan pengguna pada elemen-elemen tertentu. Contoh penggunaan untuk kebutuhkan ini misalnya adalah Membuat daftar isi postingan.

Bagikan ke: