Kthehu tek bazat: Cili është ndryshimi midis atributeve HTML ‘id’ dhe ‘emri’?

Foto nga Maria Teneva në Unsplash

Cila është rëndësia e tyre dhe cilat janë ato?

Këto pyetje, megjithëse mund të duken themelore, janë relevante dhe qëllimi i këtij postimi është pikërisht për t'iu përgjigjur atyre.

Pra, midis këtyre dy elementeve, më e thjeshta për t’u kuptuar (dhe më e fuqishmja) është atributi ‘id’.

Atributi "id":

Ky atribut, konsiderohet një atribut Global që përbëhet nga një atribut që është i zakonshëm për të gjithë elementët HTML - çdo element HTML mund të përmbajë atributin id.
Sipas përcaktimit, ky atribut konsiderohet një identifikues unik (ID) dhe do të thotë se ai duhet të jetë unik për faqe HTML.

Për çfarë është?

Atributi id përdoret kryesisht në JavaScript për të marrë qasje të drejtpërdrejtë në elementin e dëshiruar.
Shembull i përdorimit:

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

Një skenar tjetër ku mund të përdoret (në varësi të skenarit tuaj, një qasje më e mirë mund të jetë përdorimi i klasave të ripërdorshme) është përmes stilimit CSS duke përdorur selektorin e identitetit, për shembull:

#myelementid
 sfond-ngjyra: e kuqe;
}

Atributi "emër":

Atributi i emrit, nga ana tjetër, vlen vetëm për disa elemente HTML, të tilla si hyrje, buton, zgjidhni, ndër të tjera.

Për çfarë është?

Atributi i emrit përdoret për të paraqitur të dhënat e formave në një server në internet.
Kur dorëzojmë një formë, vlerat në elementët tuaj HTML, inputi i tillë, butoni, përzgjedhja, etj, dërgohen duke përdorur atributin e emrit dhe jo id - kjo është e rëndësishme!

Le ta shqyrtojmë elementin e mëposhtëm HTML:

Ky element:

  • është një element hyrje në llojin e tekstit, d.m.th. lejon futjen e karaktereve të tekstit
  • përmban tekstin "superuser"
  • atributi i identitetit ka vlerën ‘emrin e përdoruesit’
  • atributi i emrit ka vlerën ‘myusername’
  • ju mund të bashkëveproni me të duke përdorur:
dokument.getElementById ('emrin e përdoruesit'). vlera = 'megauser';
  • gjithashtu mund të ndërveproni me të duke përdorur përzgjedhësin e emrit (OK, mund ta bëni atë, por rekomandohet të përdorni atributin id pasi është shumë më efikas):
document.querySelector ("input [name = 'myusername']"). vlera = 'testuser';
  • mund të aplikoni stilet CSS duke përdorur zgjedhësin e identitetit:
#username {font-peshë: 700
  • ju gjithashtu mund të aplikoni stilet CSS duke përdorur zgjedhësin e emrit (gjithashtu mund ta bëni këtë, por nuk rekomandohet gjithashtu, pasi që në këtë rast stilet tuaja shoqërohen fort me dokumentin tuaj - nëse ndryshoni emrin e elementit tuaj do të humbni stilet ):
input [name = 'myusername'] {padding: 20px; }

Sidoqoftë, kur forma i paraqitet serverit, atributi i identitetit nuk do të përdoret, dhe kjo është aty ku atributi i emrit fiton rëndësi.
Në këtë rast të veçantë, vlera e hyrjes do të dorëzohet me vlerën e "superuserit", si dhe "emrin" të elementit të cilit i përket - kështu, të dhënat e dorëzuara do të jenë:

myusername = superuser

A mund të kem një element HTML me këto dy atribute?

Sigurisht, këto dy atribute HTML plotësojnë njëra-tjetrën. Ju mund të përdorni ID për të bashkëvepruar me elementin nga JavaScript ose CSS dhe emrin për të transferuar informacionin në server.

Në specifikimin HTML 3.2 (datë janar 1997) mund të gjeni referenca të hollësishme për atributin e emrit dhe referenca e vetme për id është:

Atributet ID, CLASS dhe STYLE nuk janë përfshirë në këtë version të HTML.

Shtë përfundimtare që atributi i emrit u krijua së pari dhe id u krijua më vonë.

Referencat: