Aria Live Regions
When content changes after initial load assistive technology users may not "see" the changes.
aria-live attribute allows us to inform the user of these changes.
Some good use cases for
aria-live include form validation and live chat.
In the below example make sure the page starts with an empty element (in this example
message is undefined):
polite will ensure that that anything read will not interrupt what is currently being read. You can change this to
assertive to immediately read the announcement.
During form validation the value of
message will be changed and the screen reader will announce the value when that happens.