Skip to content

Slight rework of setHTML to clarify removed elements #41695

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
sideshowbarker merged 1 commit into from
Oct 26, 2025
Merged

Slight rework of setHTML to clarify removed elements #41695

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 8 additions & 2 deletions files/en-us/web/api/element/sethtml/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,12 @@ browser-compat: api.Element.setHTML

{{APIRef("HTML Sanitizer API")}}{{SeeCompatTable}}

The **`setHTML()`** method of the {{domxref("Element")}} interface provides an XSS-safe method to parse and sanitize a string of HTML into a {{domxref("DocumentFragment")}}, and then insert it into the DOM as a subtree of the element.
The **`setHTML()`** method of the {{domxref("Element")}} interface provides an XSS-safe method to parse and sanitize a string of HTML and insert it into the DOM as a subtree of the element.

The method removes any elements and attributes that are considered XSS-unsafe, even if allowed by a passed sanitizer.
Notably, the following elements are always removed: {{HTMLElement("script")}}, {{HTMLElement("frame")}}, {{HTMLElement("iframe")}}, {{HTMLElement("object")}}, {{SVGElement("use")}}, event handler attributes, and data attributes.
Copy link
Member

@Josh-Cena Josh-Cena Oct 27, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Does it remove data attributes always? Reading the spec https://wicg.github.io/sanitizer-api/#sanitizerconfig-remove-unsafe, I only see the baseline config (which btw includes 6 distinct elements; <embed> is missed here) plus event handler attributes.

Copy link
Collaborator Author

@hamishwillee hamishwillee Oct 27, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for your care. Correct - the data attributes are removed by the default sanitizer but are not always removed. I tidied this up in #41715


It is recommended (if supported) as a drop-in replacement for {{domxref("Element.innerHTML")}} when setting a user-provided string of HTML.

## Syntax

Expand All @@ -27,9 +32,10 @@ setHTML(input, options)
- : An options object with the following optional parameters:
- `sanitizer`
- : A {{domxref("Sanitizer")}} or {{domxref("SanitizerConfig")}} object which defines what elements of the input will be allowed or removed, or the string `"default"` for the default configuration.
The method will remove any XSS-unsafe elements and attributes, even if allowed by the sanitizer.

Note that generally a `Sanitizer` is expected to be more efficient than a `SanitizerConfig` if the configuration is to be reused.
If not specified, the default sanitizer configuration is used.
The default configuration only allows known elements and attributes that are considered XSS-safe; notably, {{HTMLElement("script")}}, {{HTMLElement("frame")}}, {{HTMLElement("iframe")}}, {{HTMLElement("object")}}, {{SVGElement("use")}}, event handler attributes, and data attributes are all not in the allowlist.

### Return value

Expand Down
7 changes: 5 additions & 2 deletions files/en-us/web/api/shadowroot/sethtml/index.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,9 @@ browser-compat: api.ShadowRoot.setHTML

{{APIRef("HTML Sanitizer API")}}

The **`setHTML()`** method of the {{domxref("ShadowRoot")}} interface provides an XSS-safe method to parse and sanitize a string of HTML into a {{domxref("DocumentFragment")}}, which then replaces the existing tree in the Shadow DOM.
The **`setHTML()`** method of the {{domxref("ShadowRoot")}} interface provides an XSS-safe method to parse and sanitize a string of HTML, which then replaces the existing tree in the Shadow DOM.

It is recommended (if supported) as a drop-in replacement for {{domxref("ShadowRoot.innerHTML")}} when setting a user-provided string of HTML.

## Syntax

Expand All @@ -25,9 +27,10 @@ setHTML(input, options)
- : An options object with the following optional parameters:
- `sanitizer`
- : A {{domxref("Sanitizer")}} or {{domxref("SanitizerConfig")}} object which defines what elements of the input will be allowed or removed, or the string `"default"` for the default configuration.
The method will remove any XSS-unsafe elements and attributes, even if allowed by the sanitizer.

Note that generally a `Sanitizer` is expected to be more efficient than a `SanitizerConfig` if the configuration is to be reused.
If not specified, the default sanitizer configuration is used.
The default configuration only allows known elements and attributes that are considered XSS-safe; notably, {{HTMLElement("script")}}, {{HTMLElement("frame")}}, {{HTMLElement("iframe")}}, {{HTMLElement("object")}}, {{SVGElement("use")}}, event handler attributes, and data attributes are all not in the allowlist.

### Return value

Expand Down