Mitä ovat globaalit attribuutit HTML:ssä?

Question

Accepted Answer

**Globaalit attribuutit** ovat attribuutteja, jotka voit lisätä *mihin tahansa* HTML-elementtiin, riippumatta sen tyypistä. Ne tarjoavat tunnistamisen, tyylittämisen koukut, saavutettavuustiedot ja metatiedot. ```html ``` ## Eniten käytetyt - **`id`** — uniikki ankkuri CSS:lle (`#hero`), JS:lle (`getElementById`), ja sivun sisäisille linkeille (`href="#hero"`). - **`class`** — pääasiallinen tyylittämisen/skriptaamisen koukku; uudelleenkäytettävä eri elementeille. - **`data-*`** — liitä mukautetut tiedot elementteihin, lue JS:ssä `element.dataset`-kautta. - **`tabindex`** — hallitse kohdistettavuutta ja näppäimistön sarkain-järjestystä (`0` = kohdistettava järjestyksessä, `-1` = kohdistettava vain skriptin kautta). - **`hidden`**, **`title`**, **`lang`**, **`role`**, **`aria-*`** — näkyvyys, työkaluvihjeet, kieli ja saavutettavuus. ## data-* käytännössä ```html ``` ```js button.dataset.action; // "delete" button.dataset.id; // "7" (always a string) ``` ## Miksi sillä on merkitystä Globaalit attribuutit ovat jaettua työkalupakkia, jota käytät lähes jokaisessa elementissa — `class`/`id` tyylittämiseen ja skriptaukseen, `data-*` JS:lle tiedon välittämiseen, ja `tabindex`/`role`/`aria-*` saavutettavuudelle. Niiden tunteminen pitää merkinnän puhtaana ja toiminnan yhtenäisenä.