24th July 2026 at 11:58pm
A button can carry accessibility and metadata attributes that pass straight through to the HTML element. They have no visible effect, so this example shows the markup rather than a result:
aria-labelgives an accessible name when the label is only an iconroleoverrides the implied ARIA roletabindexsets the keyboard focus orderdata-*attaches custom data attributes for scriptsselectedAriachooses which ARIA stateselectedClasstoggles
Inspect the button in your browser to see the attributes on the element.
| title | Output |
<button aria-label="Close" class="" data-action="close" role="button" tabindex="0"> × </button>