Podľa W3C, atribút ID v HTML je jedinečný identifikátor prvku. Poskytuje spôsob identifikácie oblasti webovej stránky pre štýly CSS, kotviace odkazy a ciele pre skripty.
Na čo sa používa atribút ID?
Atribút ID vykonáva pre webové stránky niekoľko akcií:
- Selektor štýlov: Toto je funkcia, pre ktorú väčšina ľudí používa atribút ID. Pretože sú jedinečné, pri vytváraní štýlu pomocou vlastnosti ID budete štýlovať iba jednu položku na svojej webovej stránke. Nevýhodou použitia ID na účely stylingu je, že má veľmi vysokú úroveň špecifickosti, čo môže byť veľmi náročné, ak potrebujete z nejakého dôvodu neskôr zmeniť štýl v a šablóna so štýlmi. Z tohto dôvodu sa súčasné webové praktiky prikláňajú k používaniu tried a selektorov tried namiesto ID a selektorov ID na všeobecné účely stylingu.
- Pomenované kotvy na prepojenie: Webové prehliadače zacielite na presné umiestnenia vo svojich webových dokumentoch tak, že ukážete na ID na konci adresy URL. Pridajte id na koniec adresy URL stránky, pred ktorou je značka hash. Prepojte tieto kotvy so samotnou stránkou pridaním značky hash a názvu ID do súboru href atribút pre prvok. Napríklad pre divíziu s ID kontakt, prepojte ho na tejto stránke s #kontakt.
- Odkaz na skripty: Ak píšete akékoľvek funkcie Javascript, použite atribút ID, aby ste pomocou skriptov mohli vykonať zmeny v presnom prvku na stránke.
- Ostatné spracovanie: ID podporuje spracovanie vo vašich webových dokumentoch ľubovoľným spôsobom. Môžete napríklad extrahovať kód HTML do databázy a na identifikáciu polí použiť atribút ID.
Pravidlá používania atribútu ID
Zaistite, aby vaše atribúty ID zodpovedali týmto trom štandardom:
- ID musí začínať písmenom (a-z alebo A-Z).
- Všetky nasledujúce znaky môžu byť písmená, číslice (0-9), spojovníky (-), podčiarkovníky (_), dvojbodky (:) a bodky (.).
- Každé ID musí byť v dokumente jedinečné.
Pomocou atribútu ID
Po identifikácii jedinečného prvku vášho webu použite štýly na štýl iba toho jedného prvku.
Napríklad na identifikáciu s názvom ID kontakt, použite niektorú z týchto foriem:
div # kontakt {background: # 0cf;}
#contact {background: # 0cf;}
Prvá vzorka sa zameriava na divíziu s atribútom ID kontakt. Druhá z nich stále zacieľuje na prvok s ID kontakt, len by to nestanovovalo, že je to rozdelenie. Konečný výsledok stylingu by bol úplne rovnaký.
Môžete tiež vytvoriť odkaz na konkrétny prvok bez pridania akýchkoľvek značiek.
Odkaz na tento odsek vo vašich skriptoch s getElementById Metóda JavaScript:
document.getElementById ("kontaktná časť")
Atribúty ID sú v HTML stále veľmi užitočné triedni selektori nahradili ich pre najbežnejšie stylingové účely. Ak použijete atribút ID ako háčik pre štýly a zároveň ich použijete ako ukotvenie pre odkazy alebo ciele pre skripty, znamená to, že v dnešnom webdizajne majú stále dôležité miesto.