DOMTokenList: replace() メソッド

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.

replace()DOMTokenList インターフェイスのメソッドで、既存のトークンを新しいトークンで置き換えます。最初のトークンが存在しない場合、 replace() はすぐに false を返し、トークンリストに新しいトークンを追加しません。

構文

js
replace(oldToken, newToken)

引数

oldToken

置き換えたいトークンを表す文字列です。

newToken

oldToken を置き換えたいトークンを表す文字列です。

返値

論理値で、 oldToken の置き換えに成功した場合は true、それ以外の場合は false です。

以下の例では、 <span> 要素に設定されたクラスのリストを DOMTokenList として受け取るのに Element.classList を使用しています。それからリスト内のトークンを置き換え、リストを <span>Node.textContent に書き込みます。

最初に HTML です。

html
<span class="a b c"></span>

そして 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";

出力結果は以下のようになります。

仕様書

Specification
DOM Standard
# ref-for-dom-domtokenlist-replace①

ブラウザーの互換性

BCD tables only load in the browser