JavaScript Element ariaBrailleLabel Property

Beginner
5 min read
Updated: Nov 2026
3 examples
Property
Decorative image with the word ARIABRAILLELABEL

Definition

Element.ariaBrailleLabel reflects the aria-braillelabel attribute (MDN). It is a string intended for assistive technologies that present content in braille. Set it only when a braille-specific label improves the experience — not as a copy of aria-label.

Read the notes below before you get or set this property. Prefer feature detection when support is limited.

Syntax

Use el.ariaBrailleLabel. Start with this line.

JavaScript
element.ariaBrailleLabel
CallWhat it does
element.ariaBrailleLabelPrimary signature.

Built into the browser. Read or assign el.ariaBrailleLabel — no import required.

Library declarations
JavaScript
element.ariaBrailleLabel

Parameters

This member has no parameters beyond those shown in the signature.

Return Value

Return ValueDescription
*The current value of el.ariaBrailleLabel.

JavaScript Examples

Example 1 — Read ariaBrailleLabel (MDN)

Read the reflected braille label from a button.

JavaScript
const button = document.getElementById("button");
console.log(button.ariaBrailleLabel);
// → "***"
Try It Yourself

How It Works

  1. HTML sets aria-braillelabel="***".
  2. Property reflects it as a string.
  3. Visible text can stay long and clear for sighted users.
  4. Braille AT can use the shorter label (MDN).

Example 2 — Set the Label (MDN)

Update the braille label from JavaScript.

JavaScript
const button = document.getElementById("button");
console.log(button.ariaBrailleLabel); // "***"

button.ariaBrailleLabel = "3*";
console.log(button.ariaBrailleLabel); // "3*"
Try It Yourself

How It Works

  1. Assign a string. Intended for braille conversion (MDN).
  2. Attribute updates to match.
  3. Keep it meaningful — not a dump of the spoken name.
  4. Prefer short forms when that improves braille UX.

Example 3 — Sync With a Rating

Rebuild a short braille label when the rating changes.

JavaScript
const button = document.getElementById("button");
let stars = 3;

function updateRating(n) {
  stars = n;
  button.textContent = n + " out of 5 stars";
  button.ariaBrailleLabel = "*".repeat(n);
}

updateRating(4);
console.log(button.ariaBrailleLabel); // "****"
Try It Yourself

How It Works

  1. Update visible text for everyone.
  2. Build a short braille form (here: star characters).
  3. Assign ariaBrailleLabel so braille stays in sync.
  4. Skip the property if a short form is not needed.
Compatibility

Browser Support

Element.ariaBrailleLabel is Baseline 2024 on MDN (newly available since September 2024). Feature-detect when reading/writing from JavaScript on older engines.

✓ Baseline 2024

Element.ariaBrailleLabel

Reflect aria-braillelabel — Baseline newly available.

2024 Baseline
Google Chrome Supported · Desktop & Mobile
Full support
Mozilla Firefox Supported · Desktop & Mobile
Full support
Apple Safari Supported · macOS & iOS
Full support
Microsoft Edge Supported · Chromium
Full support
Internet Explorer No native support · Use a polyfill
Polyfill
Opera Supported · Modern versions
Full support
Samsung Internet Supported · Android
Full support
Android WebView Supported · Modern WebView
Full support
ariaBrailleLabel Baseline 2024

Bottom line: Use only when a braille-specific label improves UX. Prefer short meaningful forms (e.g. "***"). Not a copy of aria-label.

Frequently Asked Questions

It reflects the aria-braillelabel attribute as a string — a braille-oriented label for assistive technologies that present content in braille (MDN).
No. MDN marks Element.ariaBrailleLabel as Baseline 2024 (newly available since September 2024). It is not Deprecated, Experimental, or Non-standard.
Only when a braille-specific label improves the experience (MDN). If the normal accessible name already converts well to braille, do not set it.
aria-label is the spoken/accessible name for screen readers. aria-braillelabel is an optional override for how that name should appear in braille — it should not simply copy aria-label.
An unconstrained string intended to be converted into braille (for example MDN’s "***" for a star rating).
Yes. Reading and writing ariaBrailleLabel updates the reflected aria-braillelabel attribute (MDN).

Next: ariaBrailleRoleDescription

Learn braille-specific role descriptions for assistive technologies.

ariaBrailleRoleDescription tutorial →

About the author

Mari Selvan M P
Mari Selvan M P 🔗

Developer, cloud engineer, and technical writer

  • Experience 12 years building web and cloud systems
  • Focus Full Stack Development, AWS, and Developer Education

I write practical tutorials so students and working developers can learn by doing—from databases and APIs to deployment on AWS.

AWS Certified Developer – Associate (Credly)

10 people found this page helpful

JavaScript Element ariaAutoComplete Property JavaScript Element ariaBrailleRoleDescription Property