Əsaslara qayıdın: HTML 'id' və 'name' atributları arasında nə fərq var?

Maria Teneva'nın Unsplash'dəki şəkli

Onların əhəmiyyəti nədir və onlar nədir?

Bu suallar, əsas görünsə də, müvafiqdir və bu yazının məqsədi dəqiq cavab verməkdir.

Beləliklə, bu iki element arasında ən sadə (və ən güclü) 'id' atributudur.

'İd' atributu:

Bu atribut, bütün HTML elementləri üçün ortaq olan bir atributdan ibarət Qlobal bir atribut hesab olunur - hər hansı bir HTML elementi id atributunu özündə saxlaya bilər.
Tərifinə görə bu atribut unikal identifikator (ID) sayılır və o deməkdir ki, hər HTML səhifədə unikal olmalıdır.

Bu nə üçündür?

İd atributu, ilk növbədə JavaScript-də istədiyiniz elementə birbaşa giriş əldə etmək üçün istifadə olunur.
İstifadə nümunəsi:

var myElement = document.getElementById ('myelementid');

Istifadə edilə biləcəyi başqa bir ssenari (ssenarinizdən asılı olaraq, təkrar istifadə olunan siniflərdən istifadə etməklə daha yaxşı bir yanaşma) id seçicisindən istifadə edərək CSS üslubu vasitəsilə həyata keçirilir, məsələn:

#myelementid {
 background-color: qırmızı;
}

'Ad' atributu:

Digər tərəfdən ad atributu, giriş, düymə, seçmək kimi bəzi HTML elementlərinə aiddir.

Bu nə üçündür?

Ad atributu formaları məlumatları veb serverə təqdim etmək üçün istifadə olunur.
Bir forma təqdim etdikdə, HTML elementlərinizdəki dəyərlər, məsələn giriş, düymə, seçim və s. İd at deyil, atributdan istifadə olunur - bu vacibdir!

Aşağıdakı HTML elementini nəzərdən keçirək:

Bu element:

  • mətn tipli giriş elementidir, yəni mətn işarələrini daxil etməyə imkan verir
  • 'super istifadəçi' mətni var
  • id atributu 'istifadəçi adı' dəyərinə malikdir
  • ad atributu 'myusername' dəyərinə malikdir
  • istifadə edərək onunla əlaqə qura bilərsiniz:
sənəd.getElementById ('istifadəçi adı'). value = 'megauser';
  • ad seçicisindən istifadə edərək onunla da əlaqə qura bilərsiniz (Tamam, bunu edə bilərsiniz, lakin id atributundan istifadə etmək tövsiyə olunur, çünki daha səmərəlidir):
sənəd.querySelector ("giriş [name = 'myusername']"). value = 'testuser';
  • id selector istifadə edərək CSS üslublarını tətbiq edə bilərsiniz:
#username {font-weight: 700}
  • ad seçicisindən istifadə edərək CSS üslublarını da tətbiq edə bilərsiniz (bunu da edə bilərsiniz, amma bu da tövsiyə edilmir, çünki bu halda üslublarınız sənədinizə möhkəm birləşdirilir - elementinizin adını dəyişdirsəniz üslublarınızı itirəcəksiniz ):
giriş [name = 'myusername'] {doldurma: 20px; }

Bununla birlikdə, forma serverə təqdim edildikdə, id atributu istifadə edilməyəcək və ad atributu aktuallığını qazandığı yerdir.
Bu vəziyyətdə giriş dəyəri "superuser" dəyəri ilə əlaqəli olan elementin "adı" ilə birlikdə təqdim ediləcəkdir - beləliklə, təqdim olunan məlumatlar aşağıdakılar olacaqdır:

myusername = super istifadəçi

Bu iki atributu olan HTML elementinə sahib ola bilərəmmi?

Əlbəttə ki, bu iki HTML atributu bir-birini tamamlayır. Məlumatı serverə ötürmək üçün şəxsiyyət sənədini JavaScript və ya CSS ilə ad və qarşılıqlı əlaqə yaratmaq üçün istifadə edə bilərsiniz.

HTML 3.2 spesifikasiyasında (1997-ci ilin yanvar ayına aid) adın atributu ilə bağlı ətraflı istinadları tapa bilərsiniz və id üçün yeganə istinad budur:

ID, CLASS və STYLE atributları HTML-nin bu versiyasına daxil deyil.

Əvvəlcə atributun yaradıldığı və idin daha sonra yaradıldığı qənaətlidir.

İstinadlar: