Atributos globales son atributos que puedes colocar en cualquier elemento HTML, independientemente de su tipo. Proporcionan identificación, hooks para estilos, información de accesibilidad y metadatos.
html
Content
id — anclaje único para CSS (#hero), JS (getElementById) y enlaces dentro de la página (href="#hero").class — el hook principal para estilos/scripting; reutilizable en múltiples elementos.data-* — adjuntar datos personalizados a elementos, accesibles en JS mediante element.dataset.tabindex — controlar la capacidad de enfoque y el orden de tabulación con teclado (0 = enfocable en orden, -1 = enfocable solo mediante script).hidden, title, lang, role, aria-* — visibilidad, tooltips, idioma y accesibilidad.<button data-action="delete" data-id="7">Delete</button>
button.dataset.action; // "delete"
button.dataset.id; // "7" (always a string)
Los atributos globales son el conjunto de herramientas compartido que utilizas en casi cualquier elemento — class/id para estilos y scripting, data-* para pasar datos a JS, y tabindex/role/aria-* para accesibilidad.
Conocerlos mantiene el markup limpio y el comportamiento consistente.