JavaScript Element ariaSetSize Property

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

Definition

Element.ariaSetSize reflects the aria-setsize attribute: how many items are in the full set of listitems, treeitems, tabs, options, and similar widgets (MDN). The value is a string integer (or "-1" if unknown).

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

Syntax

Use el.ariaSetSize. Start with this line.

JavaScript
el.ariaSetSize / el.ariaSetSize = value
CallWhat it does
el.ariaSetSize / el.ariaSetSize = valuePrimary signature.

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

Library declarations
JavaScript
el.ariaSetSize / el.ariaSetSize = value

Parameters

ParameterDescription
Item in a setRequired. option / tab / listitem / treeitem…
String integerRequired. Full set size, or "-1" if unknown

Return Value

Return ValueDescription
*The current value of el.ariaSetSize.

JavaScript Examples

Example 1 — Read ariaSetSize

Log the total set size from a tab.

JavaScript
const el = document.getElementById("tab-id");
console.log(el.ariaSetSize); // "3"

// HTML: <button role="tab" id="tab-id" aria-setsize="3">…</button>
Try It Yourself

How It Works

  1. Find the tab. getElementById returns the tab node.
  2. Read the reflection. ariaSetSize returns the aria-setsize string.
  3. Interpret "3". The complete set has three items (even if fewer are in the DOM).
  4. Missing attribute. If unset, many browsers return null.

Example 2 — Update the Size (MDN)

MDN: change the reported set size from "3" to "4".

JavaScript
const el = document.getElementById("tab-id");

console.log(el.ariaSetSize); // "3"
el.ariaSetSize = "4";
console.log(el.ariaSetSize); // "4"
console.log(el.getAttribute("aria-setsize")); // "4"
Try It Yourself

How It Works

  1. Start at 3. The first log shows the initial total.
  2. Assign a string. el.ariaSetSize = "4" updates the reflected attribute.
  3. Confirm both sides. Property and getAttribute both report "4".
  4. In a real UI. Update ariaSetSize on every item in the group when the total changes.

Example 3 — Partial Listbox (MDN Fruit)

Only items 5–8 are in the DOM; the full set has 16 options.

JavaScript
const bananas = document.getElementById("opt-bananas");

console.log(bananas.ariaSetSize);  // "16"
console.log(bananas.ariaPosInSet); // "6"
// AT can announce: "item 6 of 16"
Try It Yourself

How It Works

  1. Incomplete DOM. Only four options are loaded, but the full list has 16.
  2. Same set size. Each option has aria-setsize="16".
  3. Unique position. Bananas use aria-posinset="6" (1-based in the full set).
  4. Why it matters. Without these, the browser would wrongly count only the four visible options.
Compatibility

Browser Support

Element.ariaSetSize is Baseline Widely available (MDN: across browsers since October 2023).

✓ Baseline · Widely available

Element.ariaSetSize

Supported in modern Chromium, Firefox, Safari, and Edge. Internet Explorer has no ariaSetSize IDL — use getAttribute / setAttribute there.

95% Modern browser support
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
Element.ariaSetSize Excellent

Bottom line: Safe for modern web apps. Use ariaSetSize when the DOM is incomplete, and keep ariaPosInSet aligned with the full set.

Frequently Asked Questions

It reflects the aria-setsize attribute as a string integer that tells assistive technologies how many items are in the full set of listitems, treeitems, tabs, options, and similar widgets.
No. MDN marks Element.ariaSetSize as Baseline Widely available (since October 2023). It is not Deprecated, Experimental, or Non-standard.
When not all items are in the DOM (pagination, virtual scrolling, lazy loading). If every item is present, the browser can usually count the set and you do not need aria-setsize or aria-posinset (MDN).
aria-setsize="-1" means the set size is unknown — useful when the total is huge, indefinite, or changes often (MDN).
On each item in the set (for example each option or tab), not on the container. Every item usually shares the same set size value (MDN).
ariaSetSize is the total count. ariaPosInSet is this item’s 1-based position in that full set (between 1 and the positive set size).

Next: ariaSort

Learn the reflected aria-sort property for ascending, descending, and other column sort states.

ariaSort 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)

12 people found this page helpful

JavaScript Element ariaSelected Property JavaScript Element ariaSort Property