Barcha elementlarning sinf va identifikator kabi bir xil xususiyatlarga ega ekanligini qanday aniqlash mumkin?

Klasslar (class) va identifikatorlar (id) HTML atributlari bo‘lib, ular CSS yordamida uslublash va JavaScript yordamida o‘zaro ta’sir qilish uchun elementlarni tanlash imkonini beradi.

Klass:

• Bir nechta HTML elementlariga berilishi mumkin.
• Umumiy vizual yoki xulq-atvor xususiyatlariga ega elementlarni guruhlash uchun ishlatiladi.
• CSSda klass selektori nuqta (.) bilan boshlanadi, masalan: .menga-klass.
• JavaScriptda, klass bo‘yicha elementlar getElementsByClassName yoki querySelectorAll metodlari bilan tanlanadi.

Identifikator:

• Butun HTML sahifa ichida unikal bo‘lishi kerak.
• Ma’lum bir elementni aniqlash uchun ishlatiladi.
• CSSda identifikator selektori raqam (#) bilan boshlanadi, masalan: #menga-id.
• JavaScriptda, ID bo‘yicha element getElementById metodi bilan tanlanadi.

Misol:

  <div class="karta">
      <p>Karta matni 1</p>
  </div>
  <div class="karta">
      <p>Karta matni 2</p>
  </div>
  <button id="mengaButton" class="btn">Tugma</button>

  .karta { /* Barcha "karta" klassiga ega elementlarni uslublash */
      border: 1px solid grey;
      padding: 10px;
      margin-bottom: 10px;
  }

  #mengaButton { /* Faqat ID "mengaButton" bo‘lgan elementni uslublash */
      background-color: blue;
      color: white;
  }

  .btn { /* Barcha tugmalar uchun umumiy uslublar */
      padding: 8px 16px;
      cursor: pointer;
  }

  // Barcha "karta" klassiga ega elementlarni olish
  const kartalar = document.getElementsByClassName('karta');

  // ID "mengaButton" bo‘yicha elementni olish
  const tugma = document.getElementById('mengaButton');

  // Tugmaga bosish hodisasi uchun event qo‘shish
  if (tugma) {
      tugma.addEventListener('click', () => {
          alert('Tugma bosildi!');
      });
  }

Ikkala klasslar va identifikatorlar HTML elementlar atributlari bo‘lib, ular to‘g‘ridan-to‘g‘ri markupda belgilangan. Bu ularni CSS yordamida uslublash va JavaScript yordamida xulq-atvorni boshqarish uchun ishlatishga imkon beradi. O‘xshash elementlar uchun klasslar va alohida elementlar uchun yagona IDlar ishlatish odatiy amaliyotdir.