Use a small DOM check to find each aria-describedby ID reference that has no matching element in the same document. It catches broken links between elements—not poor descriptions or accessibility problems generally.
What the check detects
aria-describedby associates an element with descriptive information by referencing one or more element IDs. Each referenced ID must identify an element in the same DOM document; it cannot point to a page or external resource. W3C WAI’s ARIA1 technique describes this same-document requirement and checks both the references and whether their content provides additional information.
As an Amazon Associate I earn from qualifying purchases.
The check below splits the attribute into ID tokens, looks up each token, and reports those with no matching element:
Recommended Free Tools
function findBrokenDescribedbyReferences(root = document) {
const issues = [];
for (const element of root.querySelectorAll('[aria-describedby]')) {
const ids = element.getAttribute('aria-describedby').trim().split(/s+/).filter(Boolean);
for (const id of ids) {
if (!root.getElementById(id)) {
issues.push({ element, id });
}
}
}
return issues;
}Call it with no argument to check the document, or pass a suitable root to check a subtree. The result is an array of objects; each object contains the element with the attribute and one unresolved ID. An empty array means this check found no missing targets in the selected scope.
What counts as a broken reference
The function checks every whitespace-separated token in each aria-describedby value. If an element references multiple IDs, it reports each one that cannot be found. A reference is resolved when the lookup finds an element with that ID in the selected document or subtree.
For a custom root, the example expects it to provide both querySelectorAll and getElementById. If your root does not provide those methods, adapt the lookup to the DOM scope you intend to check.
Rank #2
What this check does not establish
- Description quality: A matching element may contain irrelevant, unclear, or unhelpful text. W3C WAI’s ARIA1 procedure separately considers whether the referenced content provides additional information.
- Visibility: A description target may be hidden and still contribute to accessible description computation. Do not treat CSS-hidden targets as missing solely because they are not visible. See WAI-ARIA Authoring Practices Guide: Providing Accessible Names and Descriptions.
- Other ID problems: The function does not detect duplicate IDs.
- Assistive-technology behavior: Finding a target does not prove how a browser and assistive technology will present the description.
W3C’s ARIA1 page presents a technique for meeting WCAG, not a mandatory implementation. This DOM check is one narrow integrity check, not a complete accessibility audit.
Quick wins for a faster PC:
Clear out junk files and repair common Windows errorsFree Scan →Fix the driver behind crashes, sound loss and screen glitchesFind Drivers →Quick Recap
Rank #3
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
