Element.ariaModal
The ariaModal
property of the Element
interface reflects the value of the aria-modal
attribute, which indicates whether an element is modal when displayed. Applying the aria-modal
property to an element with role="dialog"
replaces the technique of using aria-hidden on the background for informing assistive technologies that content outside a dialog is inert.
Value
A DOMString
with one of the following values:
"true"
-
The element is modal.
"false"
-
The element is not modal.
Examples
In this example the aria-modal
attribute on the element with an ID of address-modal
is set to "true" indicating that this is a modal dialog. Using ariaModal
we update the value to "false".
<div role="dialog" id="address-modal" aria-labelledby="dialog1Title"
aria-describedby="dialog1Desc" aria-modal="true"></div>
let el = document.getElementById('address-modal');
console.log(el.ariaModal); // "true"
el.ariaModal = "false"
console.log(el.ariaModal); // "false"
Specifications
Specification |
---|
Accessible Rich Internet Applications (WAI-ARIA) 1.2 # dom-ariamixin-ariamodal |
Browser compatibility
BCD tables only load in the browser