The replace() method of the DOMTokenList interface replaces an existing token with a new token. If the first token doesn't exist, replace() returns false immediately, without adding the new token to the token list.
On this page
DOMTokenList: replace() method
Syntax
js
replace(oldToken, newToken)
Parameters
Return value
A boolean value, which is true if oldToken was successfully replaced, or false if not.
Examples
In the following example we retrieve the list of classes set on a <span> element as a DOMTokenList using Element.classList. We then replace a token in the list, and write the list into the <span>'s Node.textContent.
First, the HTML:
html
<span class="a b c"></span>
Now the JavaScript:
js
const span = document.querySelector("span");
const classes = span.classList;
const result = classes.replace("c", "z");
span.textContent = result ? classes : "token not replaced successfully";
The output looks like this:
Specifications
| Specification |
|---|
| DOM Standard # ref-for-dom-domtokenlist-replace① |
Browser compatibility
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
replace |
61 | 17 | 49 | No | 48 | 10.1 | 61 | 61 | 49 | 45 | 10.3 | 8.0 |
boolean_value |
67 | 18 | 61 | No | 54 | 12 | 67 | 67 | 61 | 48 | 12 | 9.0 |
© 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/DOMTokenList/replace