O que são atributos globais em HTML?

Question

Accepted Answer

**Atributos globais** são atributos que você pode colocar em *qualquer* elemento HTML, independentemente do seu tipo. Eles fornecem identificação, ganchos de estilo, informações de acessibilidade e metadados. ```html ``` ## Os mais usados - **`id`** — âncora única para CSS (`#hero`), JS (`getElementById`) e links dentro da página (`href="#hero"`). - **`class`** — o gancho primário de estilo/script; reutilizável entre elementos. - **`data-*`** — anexe dados personalizados aos elementos, leia em JS via `element.dataset`. - **`tabindex`** — controle a capacidade de foco e a ordem de tabulação do teclado (`0` = focável em ordem, `-1` = focável apenas via script). - **`hidden`**, **`title`**, **`lang`**, **`role`**, **`aria-*`** — visibilidade, dicas de ferramentas, idioma e acessibilidade. ## data-* em ação ```html ``` ```js button.dataset.action; // "delete" button.dataset.id; // "7" (always a string) ``` ## Por que isso importa Atributos globais são o kit de ferramentas compartilhado que você usa em praticamente todos os elementos — `class`/`id` para estilo e script, `data-*` para passar dados para JS, e `tabindex`/`role`/`aria-*` para acessibilidade. Conhecê-los mantém a marcação limpa e o comportamento consistente.