HTML - DOMTokenList replace() Method

Quiz

HTML DOMTokenList replace() method used to replace the already existing token in DomTokenList with a new token specified in parameter. It returns false if the old token specified in parameter does not exist and new token is not added to list.

Syntax

domtokenlist.replace(old, new);

Parameter

This method accepts two parameters as listed below.

Parameter	Description
old	It represents the existing token in the list.
new	It represents new token which will replace the old token.

Return Value

It returns a boolean value, where true represents that token has been successfully replaced and it returns false if not replaced.

Example of HTML DOMTokenList 'replace()' Method

The following example replace the class='align' with new class='right'.

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTML DOMTokenList replace() Method</title>
    <style>
        .color {
            background-color: #04af2f;
            color: white;
        }
        .font {
            font-size: 40px;
        }
        .align {
            text-align: center;
        }
        .right {
            text-align: right;
        }
    </style>
</head>
<body>
    <p>Click to replace the token.</p>
    <button onclick="fun()">Replace</button>
    <p id="replace" class="color font align">
        Welcome to Tutorials Point...
    </p>
    <script>
        function fun() {
            let x = document.getElementById("replace").classList;
            x.replace("align", "right");
        }
    </script>
</body>
</html>

Supported Browsers

Method
replace()	Yes 61	Yes 17	Yes 49	Yes 10.1	Yes 48

html_dom.htm

Print Page