Widget States


Custom widgets can also have different states described programatically:

<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"
  xmlns:wairole="http://www.w3.org/2005/01/wai-rdf/GUIRoleTaxonomy#"
  xmlns:aaa="http://www.w3.org/2005/07/aaa">

  [...]

  <span class="checkbox" id="checkbox1"
    role="wairole:checkbox"
    aaa:checked="true"
    aaa:required="true"
    aaa:invalid="true">check me!</span>
        
  <span class="slider" id="slider1" 
    role="wairole:slider"
    aaa:valuenow="10"
    aaa:valuemin="0"
    aaa:valuemax="100">
      <span class="bar"></span>
  </span>

Source: WAI-ARIA Best Practices