In JavaScript, the ariaColCount property of Element reflects the aria-colcount attribute, which defines the number of columns in a table, grid, or treegrid (MDN). It is most useful when not all columns are present in the DOM.
Read the notes below before you get or set this property. Prefer feature detection when support is limited.
Syntax
Use el.ariaColCount. Start with this line.
JavaScript
el.ariaColCount
Call
What it does
el.ariaColCount
Primary signature.
Built into the browser. Read or assign el.ariaColCount — no import required.
Library declarations
JavaScript
el.ariaColCount
Parameters
Parameter
Description
Table / grid root
Required. Where ariaColCount lives
String count
Required. Total columns, or "-1"
ariaColIndex
Optional. Maps visible columns to full indices
Return Value
Return Value
Description
*
The current value of el.ariaColCount.
JavaScript Examples
Example 1 — Read ariaColCount
MDN-style table: read the reflected column-count string.
JavaScript
const el = document.getElementById("semantic-table");
console.log(el.ariaColCount); // "2"
Read again. Confirms the property (and attribute) updated.
Keep indices honest. Update ariaColIndex if visible columns change.
Example 3 — Unknown Total ("-1")
When you know the DOM is incomplete but not the full width, use "-1".
JavaScript
const grid = document.getElementById("big-grid");
// Only some columns are rendered right now…
grid.ariaColCount = "-1";
console.log(grid.ariaColCount); // "-1"
// Later, when the server reports the full width:
grid.ariaColCount = "24";
console.log(grid.ariaColCount); // "24"
Start incomplete. Set "-1" so AT knows the DOM count may be wrong.
Learn the real total. From your API / data model.
Replace with a number string. e.g. "24".
Still label columns. Use ariaColIndex on visible headers/cells.
Compatibility
Browser Support
Element.ariaColCount is Baseline Widely available (MDN: across browsers since October 2023). It is not Deprecated, Experimental, or Non-standard.
✓ Baseline Widely available
Element.ariaColCount
Reflects aria-colcount as a string. Tell AT the full column total when the DOM shows only a subset.
BaselineWidely available
Google ChromeSupported · Desktop & Mobile
Full support
Mozilla FirefoxSupported · Desktop & Mobile
Full support
Apple SafariSupported · macOS & iOS
Full support
Microsoft EdgeSupported · Chromium
Full support
Internet ExplorerNo native support · Use a polyfill
Polyfill
OperaSupported · Modern versions
Full support
Samsung InternetSupported · Android
Full support
Android WebViewSupported · Modern WebView
Full support
ariaColCountBaseline
Bottom line: Safe for modern apps. Use string counts, set -1 when unknown, and pair with ariaColIndex for partial column sets.
Frequently Asked Questions
It reflects the aria-colcount attribute as a string that defines the total number of columns in a table, grid, or treegrid (MDN).
No. MDN marks Element.ariaColCount as Baseline Widely available (since October 2023). It is not Deprecated, Experimental, or Non-standard.
A string representing the column count (for example "2" or "3"), not a Number type. Use "-1" when the total is unknown but not all columns are in the DOM.
When not all columns are present in the DOM (virtualized or partially rendered tables). If every column is in the DOM, browsers can usually count them and the attribute is often unnecessary (MDN).
ariaColCount is the total columns; ariaRowCount is the total rows. When only some columns are shown, pair with ariaColIndex so AT knows each column’s position in the full set.
Yes. Reading and writing ariaColCount updates the reflected aria-colcount attribute.
