Element: ariaInvalid プロパティ
Baseline
2023
Newly available
Since October 2023, this feature works across the latest devices and browser versions. This feature might not work in older devices or browsers.
ariaInvalid は Element インターフェイスのプロパティで、 aria-invalid の値を反映します。application、checkbox、combobox、gridcell、listbox、radiogroup、slider、spinbutton、textbox、tree ロールの場合、入力値がアプリケーションが期待する書式に適合していないことをアクセシビリティ API に示します。
この属性が存在しない場合、または空の文字列に設定されている場合、支援技術は値が false に設定されているかのように扱います。属性が存在するが、false、grammar、spelling、または空文字列 ("") 以外の値に設定されている場合、支援技術は値を true として扱います。このプロパティは、支援技術によって処理された値ではなく、設定された属性の値を反映します。
値
以下の値のいずれかを持つ文字列です。
"true"-
この要素は不正な状態です。
"false"(既定値)-
この要素は不正な状態にありません。
"grammar"-
この要素は、文法的なエラーが検出されたため不正な状態です。
"spelling"-
この要素は、綴りエラーがは検出されたため不正な状態です。
例
この例では、要素の aria-invalid 属性が、ID が quote の要素においては省略され、null を返し、false として扱われます。ariaInvalid を使用し、値を grammar に更新します(エラーが 2 つあるため)。
<div id="quote" role="textbox" contenteditable>you are your best thing..</div>
const el = document.getElementById("quote");
log(`Initial value: ${el.ariaInvalid}`);
el.ariaInvalid = "grammar";
log(`Updated value: ${el.ariaInvalid}`);
仕様書
| Specification |
|---|
| Accessible Rich Internet Applications (WAI-ARIA)> # dom-ariamixin-ariainvalid> |
ブラウザーの互換性
Loading…