Cosa sono gli attributi globali in HTML?

Question

Accepted Answer

**Global attributes** sono attributi che puoi applicare a *qualsiasi* elemento HTML, indipendentemente dal suo tipo. Forniscono identificazione, hook per lo stile, informazioni di accessibilità e metadati. ```html ``` ## Quelli più utilizzati - **`id`** — anchor univoco per CSS (`#hero`), JS (`getElementById`) e link interni (`href="#hero"`). - **`class`** — l'hook principale per stile/scripting; riutilizzabile su più elementi. - **`data-*`** — allega dati personalizzati agli elementi, leggibili in JS via `element.dataset`. - **`tabindex`** — controlla la possibilità di ottenere il focus e l'ordine di tabulazione della tastiera (`0` = attivabile in ordine, `-1` = attivabile solo tramite script). - **`hidden`**, **`title`**, **`lang`**, **`role`**, **`aria-*`** — visibilità, tooltip, lingua e accessibilità. ## data-* in azione ```html ``` ```js button.dataset.action; // "delete" button.dataset.id; // "7" (always a string) ``` ## Perché è importante Gli attributi globali sono il toolkit condiviso che usi su quasi ogni elemento — `class`/`id` per lo stile e lo scripting, `data-*` per passare dati a JS, e `tabindex`/`role`/`aria-*` per l'accessibilità. Conoscerli mantiene il markup pulito e il comportamento coerente.