Confirmed users
1,396
edits
Accessibility/WebAccessibilityAPI: Difference between revisions
Jump to navigation
Jump to search
→Making the content accessible in JavaScript
| Line 1,167: | Line 1,167: | ||
===Change the accessible element=== | ===Change the accessible element=== | ||
Accessible element properties can be altered right on the accessible element. | Accessible element properties can be altered right on the accessible element. For example: | ||
<pre> | |||
<div id="div"></div> | |||
<script> | |||
var div = document.getElementById("div").a11ement; | |||
div.role = "button"; | |||
div.name="click me"; | |||
div.description = "test accessibility"; | |||
</script> | |||
</pre> | |||
====States==== | ====States==== | ||
<pre> | <pre> | ||
parital interface StateSet { | parital interface StateSet { | ||
void set(DOMString ... states); | void set(DOMString ... states); | ||
| Line 1,180: | Line 1,191: | ||
</pre> | </pre> | ||
<code> | <code> | ||
| Line 1,203: | Line 1,204: | ||
</pre> | </pre> | ||
Example | <b>Example.</b> | ||
<pre> | <pre> | ||
| Line 1,216: | Line 1,217: | ||
} | } | ||
</script> | </script> | ||
</pre> | |||
====Attributes==== | |||
You can add/change/delete attributes on the accessible element. For example, | |||
<pre> | |||
var listbox = document.getElementById("listbox").a11ement; | |||
listbox.attributes.set("autocomplete", "list"); | |||
</pre> | |||
====Relations==== | |||
<pre> | |||
partial interface RelationMap { | |||
void add(DOMString relation, AccessibleElement element); | |||
void remove(DOMString relation, AccessibleElement element); | |||
}; | |||
</pre> | |||
<code> | |||
RelationMap .''add'' | |||
::Puts the accessible element into relations. | |||
RelationMap .''remove'' | |||
::Breaks the given relations between these accessible elements. | |||
</code> | |||
<pre> | |||
var label = document.getElementById("label"); | |||
var control = document.getElementById("control").a11ement; | |||
control.relations.add("labelledby", label.a11yment); | |||
</pre> | </pre> | ||
| Line 1,620: | Line 1,654: | ||
The implied semantics is described by [[#SemanticsProviders|semantics provides]]. | The implied semantics is described by [[#SemanticsProviders|semantics provides]]. | ||
===Conflicts=== | |||
[to be done conflicts between native semantics, ARIA and this API] | |||
<div id="SemanticsProviders"> | <div id="SemanticsProviders"> | ||