Siniflər və identifikatorlar (ID) arasında hansı fərqləri bilirsiniz?

HTML-də class və id seçiciləri elementləri seçmək və onlara üslublar və ya skriptlər tətbiq etmək üçün istifadə olunur.

Əsas fərqlər:

• Unikalıq:
  • id bütün HTML səhifəsində unikal olmalıdır. Hər element yalnız bir id ala bilər və səhifədə eyni id-yə malik iki element olmamalıdır.
  • class səhifədə çox dəfə istifadə oluna bilər. Bir neçə element eyni class-a malik ola bilər və bir element bir neçə sinfə sahib ola bilər.
• Xüsusiyyət:
  • id, class ilə müqayisədə üslubların tətbiqində daha yüksək xüsusiyyətə (ağırlığa) malikdir. id ilə təyin olunan üslub, class və ya etiketlə təyin olunan üslubdan üstün olacaq, əgər daha spesifik qaydalar yoxdursa.
  • class id-dən aşağı, lakin etiket seçicilərindən yuxarıdır.
• JavaScript-də istifadə:
  • id tez-tez DOM-dan unikal elementi əldə etmək üçün document.getElementById() ilə istifadə olunur və bu, sürətli giriş yoludur.
  • class ümumiyyətlə document.getElementsByClassName() və ya document.querySelectorAll() ilə element qruplarını seçmək üçün istifadə olunur.

Nümunə:

HTML:

<div id="unique-element" class="styled-box">
  Unikal element
</div>
<div class="styled-box">
  Qrupun ilk elementi
</div>
<div class="styled-box highlight">
  Qrupun ikinci elementi (əlavə sinif ilə)
</div>

CSS:

#unique-element {
  /* Yüksək prioritetli unikal element üçün üslub */
  color: red;
}

.styled-box {
  /* Qrup elementləri üçün üslub */
  border: 1px solid blue;
  padding: 10px;
}

.highlight {
  /* Bəzi elementlər üçün əlavə üslub */
  background-color: yellow;
}

Müqayisə cədvəli:

Xüsusiyyət	ID (Tanımlayıcı)	Class (Sinif)
Unikalıq	Səhifədə unikal	Bir neçə dəfə istifadə edilə bilər
Tətbiq	Bir element yalnız bir ID ala bilər	Bir element bir neçə sinfə sahib ola bilər
Xüsusiyyət	Yüksək	Orta
JS-də istifadə	getElementById()	getElementsByClassName(), querySelectorAll()
Məqsəd	Unikal elementi tanımlamaq	Elementləri ümumi xüsusiyyətlərə görə qruplaşdırmaq

id və class-ın düzgün istifadəsi kodun təşkili, təmiz üslubların saxlanması və skriptlərlə səmərəli işləmək üçün vacibdir. id-dən ehtiyatla istifadə edilməli və yalnız həqiqətən unikal elementlər üçün istifadə olunmalıdır, class isə bir neçə elementə tətbiq oluna bilən üslublar və ya elementləri qruplaşdırmaq üçün istifadə edilməlidir.