Koje razlike poznaješ između klasa i identifikatora (ID)?

Selektori class i id koriste se za izbor elemenata u HTML-u i primenu stilova ili skripti na njih.

Glavne razlike:

• Jedinstvenost:
  • id mora biti jedinstven na celoj HTML stranici. Svaki element može imati samo jedan id, i na stranici ne smeju biti dva elementa sa istim id.
  • class može biti korišćen više puta na istoj stranici. Više elemenata može imati isti class, a jedan element može imati više klasa.
• Specifičnost:
  • id ima veću specifičnost (težinu) pri primeni stilova u poređenju sa class. Stil definisan putem id ima prioritet u odnosu na stil definisan putem class ili taga, ako ne postoje specifičnija pravila.
  • class ima nižu specifičnost od id, ali je viša od selektora po tagu.
• Korišćenje u JavaScript-u:
  • id se često koristi za dobijanje jedinstvenog elementa iz DOM-a pomoću document.getElementById(), što je brz način pristupa elementu.
  • class se obično koristi za izbor grupe elemenata pomoću document.getElementsByClassName() ili document.querySelectorAll().

Primer:

HTML:

<div id="unique-element" class="styled-box">
  Jedinstveni element
</div>
<div class="styled-box">
  Prvi element grupe
</div>
<div class="styled-box highlight">
  Drugi element grupe (sa dodatnom klasom)
</div>

CSS:

#unique-element {
  /* Stil za jedinstveni element sa visokim prioritetom */
  color: red;
}

.styled-box {
  /* Stil za grupu elemenata */
  border: 1px solid blue;
  padding: 10px;
}

.highlight {
  /* Dodatni stil za neke elemente */
  background-color: yellow;
}

Tabela poređenja:

Karakteristika	ID (Identifikator)	Class (Klasa)
Jedinstvenost	Jedinstven na stranici	Može se koristiti više puta
Korišćenje	Jedan element može imati jedno ID	Jedan element može imati više klasa
Specifičnost	Visoka	Srednja
Korišćenje u JS	getElementById()	getElementsByClassName(), querySelectorAll()
Svrha	Identifikacija jedinstvenog elementa	Grupisanje elemenata po zajedničkim svojstvima

Pravilno korišćenje id i class je važno za organizaciju koda, održavanje čistoće stilova i efikasni rad sa skriptama. id treba koristiti štedljivo za zaista jedinstvene elemente, dok je class namenjen stilovima koji se mogu primenjivati na više elemenata ili za grupisanje elemenata sa sličnim ponašanjem.