Što je atribut ID u HTML-u i kako se koristi?

click fraud protection

Prema W3C, atribut ID u HTML jedinstveni je identifikator elementa. Pruža način za identificiranje područja web stranice za CSS stilove, sidrene veze i ciljeve za skripte.

Čemu služi atribut ID?

Atribut ID izvodi nekoliko radnji za web stranice:

  • Birač stilskog lista: Ovo je funkcija za koju većina ljudi koristi atribut ID. Budući da su jedinstveni, oblikovat ćete samo jednu stavku na svojoj web stranici kada oblikujete pomoću svojstva ID. Loša strana upotrebe ID-a u svrhe oblikovanja je ta što ima vrlo visoku razinu specifičnosti, što ga može učiniti vrlo izazovnim ako kasnije iz nekog razloga trebate nadjačati stil tablica stilova. Zbog toga se trenutna mrežna praksa naginje korištenju klasa i selektora klasa umjesto ID-ova i ID selektora za opće stilske svrhe.
  • Imenovana sidra za povezivanje s: Web preglednici ciljajte precizna mjesta u vašim web dokumentima pokazujući na ID na kraju URL-a. Dodajte ID na kraj URL-a stranice, ispred kojeg stoji oznaka raspršivanja. Povežite se sa tim sidrištima sa samom stranicom dodavanjem hash oznake i imena ID u
    instagram viewer
    href atribut za element. Na primjer, za odjel s ID-om kontakt, link do njega na toj stranici pomoću #kontakt.
  • Referenca za skripte: Ako napišete bilo koju funkciju Javascripta, upotrijebite atribut ID kako biste svojim skriptama mogli izmijeniti precizni element na stranici.
  • Ostala prerada: ID podržava obradu vaših web dokumenata na bilo koji način koji vam treba. Na primjer, možete izdvojiti HTML u bazu podataka i koristiti ID atribut za identificiranje polja.

Pravila za upotrebu atributa ID

Osigurajte da atributi vašeg ID-a odgovaraju ovim trima standardima:

  • ID mora počinjati slovom (a-z ili A-Z).
  • Svi sljedeći znakovi mogu biti slova, brojevi (0-9), crtice (-), donje crte (_), dvotačke (:) i točke (.).
  • Svaki ID mora biti jedinstven u dokumentu.

Korištenje atributa ID

Nakon što prepoznate jedinstveni element vaše web stranice, upotrijebite stilski listovi stilizirati samo taj jedan element.

Na primjer, za identificiranje ID-a s naslovom kontakt, upotrijebite bilo koji od ovih oblika:

div # kontakt {background: # 0cf;} 
#contact {background: # 0cf;}

Prvi uzorak cilja na odjel s atributom ID od kontakt. Drugi još uvijek cilja element s ID-om kontakt, jednostavno ne bi propisalo da je to podjela. Krajnji rezultat stylinga bio bi potpuno isti.

Također se možete povezati s tim određenim elementom bez dodavanja bilo kakvih oznaka.

Navedite taj odlomak u svojim skriptama pomoću getElementById JavaScript metoda:

document.getElementById ("odjeljak za kontakt")

Atributi ID-a i dalje su vrlo korisni u HTML-u, iako izbornici razreda zamijenili su ih u najopćenitije svrhe oblikovanja. Korištenje atributa ID kao spojnice za stilove, uz istovremeno korištenje kao sidrišta za veze ili ciljeve za skripte, znači da i danas imaju važno mjesto u web dizajnu.

instagram story viewer