JavaScript Document enableStyleSheetsForSet() Method

What You’ll Learn

document.enableStyleSheetsForSet() is a deprecated, non-standard instance method that enables stylesheet titles matching a set name (see MDN Document: enableStyleSheetsForSet()). Learn the name rules, empty string vs null, what stays enabled, how it differs from selectedStyleSheetSet, modern alternatives, and five try-it labs.

Introduction

Years ago, browsers exposed alternate stylesheets — <link rel="stylesheet" title="Dark"> themes users or scripts could switch. enableStyleSheetsForSet(name) was one way to turn a named set on and turn other titled sheets off.

MDN: it enables stylesheets matching the specified name and disables all other titled sheets. Sheets without a title stay enabled (persistent styles).

Related tutorials: selectedStyleSheetSet, styleSheetSets, lastStyleSheetSet.

Understanding document.enableStyleSheetsForSet()

An instance method on Document from the legacy style sheet set API (MDN).

• name — title of the set to enable (MDN).
• Effect — matching titles enabled; other titled sheets disabled (MDN).
• Untitled sheets — never affected; always stay enabled (MDN).
• Empty string — disables alternate and preferred sheets; keeps persistent untitled sheets (MDN).
• null — no effect; use "" instead (MDN Notes).
• Case — title matches are case-sensitive (MDN Notes).
• Side effects — does not change lastStyleSheetSet or preferredStyleSheetSet (MDN Notes).
• Return value — undefined (MDN).

📝 Syntax

General form of Document.enableStyleSheetsForSet (MDN):

enableStyleSheetsForSet(name)

Parameters

• name — the name of the style sheets to enable (MDN). Matching titles are enabled; other titled sheets are disabled. Pass "" to disable alternate and preferred sheets (not persistent untitled ones).

Return value

None (undefined) (MDN).

Exceptions

None highlighted on MDN. Calling a missing method throws TypeError — feature-detect first.

MDN example

document.enableStyleSheetsForSet("Some style sheet set name");

⚖️ Legacy set APIs vs modern themes

Examples Gallery

Examples follow MDN Document: enableStyleSheetsForSet() with safe feature detection. On many modern browsers the method is missing — that is expected.

const supported = typeof document.enableStyleSheetsForSet === "function";
console.log(supported ? "legacy API available" : "enableStyleSheetsForSet missing");

if (!supported) {
  console.log("Prefer data-theme / CSS class themes instead.");
}

enableStyleSheetsForSet missing
Prefer data-theme / CSS class themes instead.

if (typeof document.enableStyleSheetsForSet === "function") {
  document.enableStyleSheetsForSet("Some style sheet set name");
  console.log("called enableStyleSheetsForSet");
} else {
  console.log("API not available");
}

API not available

if (typeof document.enableStyleSheetsForSet !== "function") {
  console.log("skipped — API missing");
} else {
  document.enableStyleSheetsForSet("");
  console.log("disabled alternate/preferred sets");
}

skipped — API missing

if (typeof document.enableStyleSheetsForSet !== "function") {
  console.log("API missing — remember: null ≠ empty string");
} else {
  document.enableStyleSheetsForSet(null); // no effect (MDN)
  console.log("null call completed with no effect");
}

API missing — remember: null ≠ empty string

function setTheme(name) {
  document.documentElement.dataset.theme = name;
}

setTheme("dark");
console.log(document.documentElement.dataset.theme); // "dark"

// CSS:
// :root[data-theme="dark"] { color-scheme: dark; background: #111; color: #eee; }

dark

🚀 Common Use Cases

• Reading legacy samples — understand old alternate stylesheet demos.
• Migrating theme pickers — replace with class / data-theme toggles.
• Interview trivia — know it is deprecated, non-standard, and not in a spec.
• Not for new apps — prefer CSS themes and prefers-color-scheme.
• Paired APIs — often appears with selectedStyleSheetSet / styleSheetSets.
• Remember — it does not update lastStyleSheetSet (MDN Notes).

📝 Notes

• MDN: Deprecated and Non-standard; not part of any specification.
• Title matches are case-sensitive (MDN Notes).
• null has no effect; use "" to disable alternate/preferred sheets (MDN Notes).
• Untitled stylesheets are never affected (MDN Notes).
• Does not change lastStyleSheetSet or preferredStyleSheetSet (MDN Notes).
• Related: selectedStyleSheetSet, styleSheetSets, lastStyleSheetSet.

💡 Best Practices